Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

__vite_ssr_import_0__.template is not a function when using ag-grid-solid #690

Closed
AlexErrant opened this issue Jan 25, 2023 · 8 comments
Closed
Labels
csr related to client render mode (ssr: false)

Comments

@AlexErrant
Copy link
Contributor

Steps to reproduce:

  1. npm init solid@latest, bare with no SSR
  2. pnpm i
  3. pnpm i ag-grid-solid ag-grid-community
  4. add import AgGridSolid from 'ag-grid-solid'; and <AgGridSolid /> to index.tsx
  5. npm run dev
  6. This yields an error:
GET http://localhost:5173/
An unhandled error occured: ReferenceError: require is not defined in ES module scope, you can use import instead
This file is being treated as an ES module because it has a '.js' file extension and 'C:\Code\solid-start-bare\node_modules\.pnpm\ag-grid-solid@29.0.0_fjdpqd2jk35t7gako4obcr5l4e\node_modules\ag-grid-solid\package.json' contains "type": "module". To treat it as a CommonJS script, rename it to use the '.cjs' file extension.
    at file:///C:/Code/solid-start-bare/node_modules/.pnpm/ag-grid-solid@29.0.0_fjdpqd2jk35t7gako4obcr5l4e/node_modules/ag-grid-solid/dist/cjs/index.js:3:11
    at ModuleJob.run (node:internal/modules/esm/module_job:194:25)
  1. I add ssr: { noExternal: ["ag-grid-solid"] } to vite.config.ts, based on Ryan's answer here.
  2. Restart npm run dev, and get a different error:
GET http://localhost:5173/
An unhandled error occured: TypeError: __vite_ssr_import_0__.template is not a function
    at ../../src/grid/core/solidCompWrapper.tsx:121:30
    at async instantiateModule (file:///C:/Code/solid-start-bare/node_modules/.pnpm/vite@3.2.5_@types+node@18.11.18/node_modules/vite/dist/node/chunks/dep-5605cfa4.js:53364:9)

StackBlitz and Github repro.

ag-grid-solid works just fine in vanilla solid-js.

@ryansolid
Copy link
Member

My guess is ag-grid is precompiled to be client only and breaks with SSR. I don't know it makes sense trying to server render it. What's the goal?

@AlexErrant
Copy link
Contributor Author

I was moving a CSR solid app to solid-start and wanted to keep it CSR. I thought solid({ ssr: false }) was enough for this, but as per this comment it looks like development mode still does SSR for some things.

When I npm run build to generate a prod build, the build hangs:

$ npm run build

> build
> solid-start build

 solid-start build
 version  0.2.16
 adapter  node

solid-start building client...
solid-start rendering index.html...

This is in both Ubuntu and Windows. I'm not sure if I should be using the Node adapter, so I tried solid-start-static:

    solid({
      ssr: true,
      adapter: solidStatic(),
    })

(I have ssr: true due to this thread.)

However, npm run build yields a similar complaint about template:

$ npm run build

> build
> solid-start build

 solid-start build 
 version  0.2.16
 adapter  static

solid-start building client...
vite v3.2.5 building for production...
✓ 60 modules transformed.
Inspect report generated at /home/alexerrant/solid-start-bare/.solid/inspect
dist/public/manifest.json                      0.93 KiB
dist/public/ssr-manifest.json                  2.88 KiB
dist/public/assets/_...404_.6488fdfa.js        0.55 KiB / gzip: 0.37 KiB
dist/public/assets/entry-client.d870915a.css   0.37 KiB / gzip: 0.26 KiB
dist/public/assets/index.fdb6b3cf.css          0.30 KiB / gzip: 0.21 KiB
dist/public/assets/entry-client.bb8ea99a.js    37.22 KiB / gzip: 14.38 KiB
dist/public/assets/index.4bd3f3a4.js           1081.37 KiB / gzip: 227.98 KiB

(!) Some chunks are larger than 500 KiB after minification. Consider:
- Using dynamic import() to code-split the application
- Use build.rollupOptions.output.manualChunks to improve chunking: https://rollupjs.org/guide/en/#outputmanualchunks
- Adjust chunk size limit for this warning via build.chunkSizeWarningLimit.
solid-start client built in: 4.685s

solid-start building server...
vite v3.2.5 building SSR bundle for production...
✓ 59 modules transformed.
Inspect report generated at /home/alexerrant/solid-start-bare/.solid/inspect
.solid/server/manifest.json     0.18 KiB
.solid/server/entry-server.js   138.43 KiB
solid-start server built in: 1.235s

file:///home/alexerrant/solid-start-bare/node_modules/.pnpm/rollup@3.10.1/node_modules/rollup/dist/es/shared/rollup.js:2041
        base = Object.assign(new Error(base.message), base);
                             ^

Error [RollupError]: "template" is not exported by "node_modules/.pnpm/solid-js@1.6.9/node_modules/solid-js/web/dist/server.js", imported by ".solid/server/handler.js".
    at error (file:///home/alexerrant/solid-start-bare/node_modules/.pnpm/rollup@3.10.1/node_modules/rollup/dist/es/shared/rollup.js:2041:30)
    at Module.error (file:///home/alexerrant/solid-start-bare/node_modules/.pnpm/rollup@3.10.1/node_modules/rollup/dist/es/shared/rollup.js:13062:16)
    at Module.traceVariable (file:///home/alexerrant/solid-start-bare/node_modules/.pnpm/rollup@3.10.1/node_modules/rollup/dist/es/shared/rollup.js:13445:29)
    at ModuleScope.findVariable (file:///home/alexerrant/solid-start-bare/node_modules/.pnpm/rollup@3.10.1/node_modules/rollup/dist/es/shared/rollup.js:11926:39)
    at Identifier.bind (file:///home/alexerrant/solid-start-bare/node_modules/.pnpm/rollup@3.10.1/node_modules/rollup/dist/es/shared/rollup.js:7855:40)
    at CallExpression.bind (file:///home/alexerrant/solid-start-bare/node_modules/.pnpm/rollup@3.10.1/node_modules/rollup/dist/es/shared/rollup.js:5653:23)
    at CallExpression.bind (file:///home/alexerrant/solid-start-bare/node_modules/.pnpm/rollup@3.10.1/node_modules/rollup/dist/es/shared/rollup.js:9382:15)
    at VariableDeclarator.bind (file:///home/alexerrant/solid-start-bare/node_modules/.pnpm/rollup@3.10.1/node_modules/rollup/dist/es/shared/rollup.js:5653:23)
    at VariableDeclaration.bind (file:///home/alexerrant/solid-start-bare/node_modules/.pnpm/rollup@3.10.1/node_modules/rollup/dist/es/shared/rollup.js:5649:28)
    at Program.bind (file:///home/alexerrant/solid-start-bare/node_modules/.pnpm/rollup@3.10.1/node_modules/rollup/dist/es/shared/rollup.js:5649:28)
    at Module.bindReferences (file:///home/alexerrant/solid-start-bare/node_modules/.pnpm/rollup@3.10.1/node_modules/rollup/dist/es/shared/rollup.js:13058:18)
    at Graph.sortModules (file:///home/alexerrant/solid-start-bare/node_modules/.pnpm/rollup@3.10.1/node_modules/rollup/dist/es/shared/rollup.js:24012:20)
    at Graph.build (file:///home/alexerrant/solid-start-bare/node_modules/.pnpm/rollup@3.10.1/node_modules/rollup/dist/es/shared/rollup.js:23897:14)
    at async file:///home/alexerrant/solid-start-bare/node_modules/.pnpm/rollup@3.10.1/node_modules/rollup/dist/es/shared/rollup.js:24911:13
    at async catchUnfinishedHookActions (file:///home/alexerrant/solid-start-bare/node_modules/.pnpm/rollup@3.10.1/node_modules/rollup/dist/es/shared/rollup.js:24066:20)
    at async rollupInternal (file:///home/alexerrant/solid-start-bare/node_modules/.pnpm/rollup@3.10.1/node_modules/rollup/dist/es/shared/rollup.js:24906:5)
    at async Object.build (file:///home/alexerrant/solid-start-bare/node_modules/.pnpm/solid-start-static@0.2.16_f63ddrunxocrtns5sxchmwmkce/node_modules/solid-start-static/index.js:39:22) {
  binding: 'template',
  code: 'MISSING_EXPORT',
  exporter: '/home/alexerrant/solid-start-bare/node_modules/.pnpm/solid-js@1.6.9/node_modules/solid-js/web/dist/server.js',
  id: '/home/alexerrant/solid-start-bare/.solid/server/handler.js',
  url: 'https://rollupjs.org/guide/en/#error-name-is-not-exported-by-module',
  pos: 280,
  loc: {
    column: 280,
    file: '/home/alexerrant/solid-start-bare/.solid/server/handler.js',
    line: 1
  },
  frame: "1: import { isServer, delegateEvents, createComponent as createComponent$1, ssrElement, renderToStringAsync, spread, ssr, ssrHydrationKey, escape, useAssets, ssrAttribute, HydrationScript, NoHydration, use, insert, memo, Portal, mergeProps as mergeProps$1, effect, className, style, template, setAttribute } from 'solid-js/web';\n" +
    '                                                                                                                                                                                                                                                                                           ^\n' +
    "2: import { createSignal, onCleanup, getOwner, runWithOwner, createMemo, createContext, useContext, createComponent, createRenderEffect, untrack, on, startTransition, resetErrorBoundaries, children, createRoot, Show, mergeProps, splitProps, sharedConfig, createUniqueId, ErrorBoundary as ErrorBoundary$1, createEffect, onMount, For, Suspense } from 'solid-js';\n" +
    "3: import { ComponentUtil, GridCoreCreator, BaseComponentWrapper, VanillaFrameworkOverrides, GridCtrl, CtrlsService, GridBodyCtrl, RowContainerName, TabGuardCtrl, FocusService, GroupCellRendererCtrl, GridHeaderCtrl, getRowContainerTypeForName, RowContainerCtrl, _, HeaderRowContainerCtrl, CssClassManager, HeaderRowType, AgPromise, PopupEditorWrapper } from 'ag-grid-community';",
  watchFiles: [
    '/home/alexerrant/solid-start-bare/.solid/server/server.js',
    '/home/alexerrant/solid-start-bare/.solid/server/handler.js',
    '/home/alexerrant/solid-start-bare/dist/public/route-manifest.json',
    '/home/alexerrant/solid-start-bare/node_modules/.pnpm/solid-start@0.2.16_55umyvmfaswzxpylft3tvr3dvm/node_modules/solid-start/node/fetch.js',
    '/home/alexerrant/solid-start-bare/node_modules/.pnpm/solid-start@0.2.16_55umyvmfaswzxpylft3tvr3dvm/node_modules/solid-start/node/globals.js',
    '/home/alexerrant/solid-start-bare/node_modules/.pnpm/solid-js@1.6.9/node_modules/solid-js/dist/server.js',
    '/home/alexerrant/solid-start-bare/node_modules/.pnpm/solid-js@1.6.9/node_modules/solid-js/web/dist/server.js',
    '/home/alexerrant/solid-start-bare/node_modules/.pnpm/ag-grid-community@29.0.0/node_modules/ag-grid-community/dist/ag-grid-community.auto.esm.js',
    '/home/alexerrant/solid-start-bare/node_modules/.pnpm/parse-multipart-data@1.5.0/node_modules/parse-multipart-data/dist/multipart.js',
    '/home/alexerrant/solid-start-bare/node_modules/.pnpm/set-cookie-parser@2.5.1/node_modules/set-cookie-parser/lib/set-cookie.js',
    '\x00/home/alexerrant/solid-start-bare/node_modules/.pnpm/parse-multipart-data@1.5.0/node_modules/parse-multipart-data/dist/multipart.js?commonjs-es-import',
    '\x00commonjsHelpers.js',
    '\x00/home/alexerrant/solid-start-bare/node_modules/.pnpm/parse-multipart-data@1.5.0/node_modules/parse-multipart-data/dist/multipart.js?commonjs-exports',
    '\x00/home/alexerrant/solid-start-bare/node_modules/.pnpm/set-cookie-parser@2.5.1/node_modules/set-cookie-parser/lib/set-cookie.js?commonjs-es-import',
    '\x00/home/alexerrant/solid-start-bare/node_modules/.pnpm/set-cookie-parser@2.5.1/node_modules/set-cookie-parser/lib/set-cookie.js?commonjs-module'
  ]
}

Unsurprisingly, npm run build succeeds with solid-start-static if I comment out <AgGridSolid />.

@ryansolid ryansolid added the csr related to client render mode (ssr: false) label Feb 2, 2023
@ryansolid
Copy link
Member

Try in 0.2.19. Hopefully this fixed.

@AlexErrant
Copy link
Contributor Author

AlexErrant commented Feb 5, 2023

Ah, I should've tried that first... because it worked! (edit: didn't realize 0.2.19 was that new!) At least in Linux it works, as exemplified by the now-working StackBlitz. npm run build also works as expected in Linux.

However, both run build and run dev fail in Windows - build exhibits the same hanging behavior, and dev fails with a different error message:

GET http://localhost:3000/
An unhandled error occured: Error: Cannot find module 'C:Codesolid-start-bare
ode_modules.pnpmsolid-start@0.2.19_xkldvgorozr2rd64n7towncbfe
ode_modulessolid-startdevCsrRoot.tsx' imported from 'C:/Code/solid-start-bare/node_modules/.pnpm/solid-start@0.2.19_xkldvgorozr2rd64n7towncbfe/node_modules/solid-start/entry-server/StartServer.tsx'
    at viteResolve (file:///C:/Code/solid-start-bare/node_modules/.pnpm/vite@3.2.5_@types+node@18.11.19/node_modules/vite/dist/node/chunks/dep-5605cfa4.js:53393:25)
    at nodeImport (file:///C:/Code/solid-start-bare/node_modules/.pnpm/vite@3.2.5_@types+node@18.11.19/node_modules/vite/dist/node/chunks/dep-5605cfa4.js:53430:15)
    at ssrImport (file:///C:/Code/solid-start-bare/node_modules/.pnpm/vite@3.2.5_@types+node@18.11.19/node_modules/vite/dist/node/chunks/dep-5605cfa4.js:53318:20)
    at eval (/node_modules/.pnpm/solid-start@0.2.19_xkldvgorozr2rd64n7towncbfe/node_modules/solid-start/entry-server/StartServer.tsx:16:37)
    at async instantiateModule (file:///C:/Code/solid-start-bare/node_modules/.pnpm/vite@3.2.5_@types+node@18.11.19/node_modules/vite/dist/node/chunks/dep-5605cfa4.js:53364:9)

(It looks like \ is escaping some characters in the path.)

WSL is my main dev environment so this isn't a problem for me. However, I'm going to leave this open as it is still technically an open issue.

Thanks very much!

@AlexErrant
Copy link
Contributor Author

Perhaps not; ref #720

@AlexErrant
Copy link
Contributor Author

Ah, it looks like a regression occurred between 0.2.18 and 0.2.19. run dev works for example-HN on Windows for 0.2.18, but not 0.2.19. Same escaping error.

GET http://localhost:3001/
Parse failure: Bad character escape sequence (8:27)
Contents of line 8: import Root from "C:\Code\xxxx\node_modules\.pnpm\solid-start@0.2.19_xkldvgorozr2rd64n7towncbfe\node_modules\solid-start\dev\CsrRoot.tsx";
An unhandled error occured: Error: Parse failure: Bad character escape sequence (8:27)
Contents of line 8: import Root from "C:\Code\xxxx\node_modules\.pnpm\solid-start@0.2.19_xkldvgorozr2rd64n7towncbfe\node_modules\solid-start\dev\CsrRoot.tsx";
    at ssrTransformScript (file:///C:/Code/xxxx/node_modules/.pnpm/vite@3.2.5_@types+node@18.11.19/node_modules/vite/dist/node/chunks/dep-5605cfa4.js:52790:15)
    at ssrTransform (file:///C:/Code/xxxx/node_modules/.pnpm/vite@3.2.5_@types+node@18.11.19/node_modules/vite/dist/node/chunks/dep-5605cfa4.js:52765:12)
    at Object.ssrTransform (file:///C:/Code/xxxx/node_modules/.pnpm/vite@3.2.5_@types+node@18.11.19/node_modules/vite/dist/node/chunks/dep-5605cfa4.js:61974:20)
    at loadAndTransform (file:///C:/Code/xxxx/node_modules/.pnpm/vite@3.2.5_@types+node@18.11.19/node_modules/vite/dist/node/chunks/dep-5605cfa4.js:36944:24)

I looked at ae36320 and 0a27fc2 but it isn't obvious to me what the problem is. In particular, the join looks fine.

image

I believe this issue affects all Windows devs.

@ryansolid
Copy link
Member

Thanks.. You are right we broke windows. Let me see what I did this time.

@ryansolid
Copy link
Member

In setting up for SolidStarts next Beta Phase built on Nitro and Vinxi we are closing all PRs/Issues that will not be merged due to the system changing. If you feel your issue was closed by mistake. Feel free to re-open it after updating/testing against 0.4.x release. Thank you for your patience.

See #1139 for more details.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
csr related to client render mode (ssr: false)
Projects
None yet
Development

No branches or pull requests

2 participants