keystone
keystone copied to clipboard
Framework Remix example server error
Following the steps in the framework-remix example, I get to the part where you go to localhost:3000 and get the following server error
Unexpected Server Error
TypeError: (0 , import_isbot.default) is not a function
Using node version v20.17.0 on firefox for ubuntu.
Here is the console output
Remix App Server started at http://localhost:3000 (http://192.168.0.8:3000)
TypeError: (0 , import_isbot.default) is not a function
at handleRequest (/home/alex/Projects/keystone/node_modules/.pnpm/@[email protected]_@[email protected]_@[email protected][email protected][email protected]/node_modules/@remix-run/dev/dist/config/defaults/node/entry.server.react-stream.tsx:18:10)
at handleDocumentRequestRR (/home/alex/Projects/keystone/node_modules/.pnpm/@[email protected]/node_modules/@remix-run/server-runtime/dist/server.js:216:18)
at requestHandler (/home/alex/Projects/keystone/node_modules/.pnpm/@[email protected]/node_modules/@remix-run/server-runtime/dist/server.js:61:18)
at /home/alex/Projects/keystone/node_modules/.pnpm/@[email protected][email protected]/node_modules/@remix-run/express/dist/server.js:39:22
Seeing as this example project is using Remix 1, I've attempted to start with a fresh Remix 2 install and slap in keystone related files into it.
The results are mixed, but it is working. I would appreciate some guidance if there is any issues in this setup.
Init Remix App
First I use npx create-remix@latest to get a fresh Remix app up and running.
Repo
Check out my repo. I just merged the package.json files and installed the dependencies. In the app I just copied bits of the keystone context code so I could do a simple query and fetch some db data.
https://github.com/wchorski/kypr
The Long Answer
there was a lot of juggling to get both keystone dev and remix vite:dev working as they both ask for a different project configs
In production I deploy both the keystone admin dashboard and my custom frontend as 2 separate apps. So I need to be able to develop on both sides.
- Remix init app ->
package.jsonhas"type": "module"," - Keystone w Remix ->
package.jsonno"type"
with type as module this error happens with keystone
yarn ks:dev
yarn run v1.22.22
$ keystone dev
✨ Starting Keystone
Error [ERR_REQUIRE_ESM]: require() of ES Module /Volumes/edata/vscode/remix-new/.keystone/config.js from /Volumes/edata/vscode/remix-new/node_modules/@keystone-6/core/dist/createExpressServer-b4283133.cjs.dev.js not supported.
config.js is treated as an ES module file as it is a .js file whose nearest parent package.json contains "type": "module" which declares all .js files in that package scope as ES modules.
Instead either rename config.js to end in .cjs, change the requiring code to use dynamic import() which is available in all CommonJS modules, or change "type": "module" to "type": "commonjs" in /Volumes/edata/vscode/remix-new/package.json to treat all .js files as CommonJS (using .mjs for all ES modules instead).
at TracingChannel.traceSync (node:diagnostics_channel:315:14)
at mod.require (/Volumes/edata/vscode/remix-new/node_modules/next/dist/server/require-hook.js:65:28)
at Object.importBuiltKeystoneConfiguration (/Volumes/edata/vscode/remix-new/node_modules/@keystone-6/core/dist/createExpressServer-b4283133.cjs.dev.js:40:10)
at async dev (/Volumes/edata/vscode/remix-new/node_modules/@keystone-6/core/scripts/cli/dist/keystone-6-core-scripts-cli.cjs.dev.js:1241:20) {
code: 'ERR_REQUIRE_ESM'
}
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
I removed type from package.json and got another error
yarn dev
yarn run v1.22.22
$ remix vite:dev
The CJS build of Vite's Node API is deprecated. See https://vite.dev/guide/troubleshooting.html#vite-cjs-node-api-deprecated for more details.
(node:25234) [MODULE_TYPELESS_PACKAGE_JSON] Warning: Module type of file:///Volumes/edata/vscode/remix-new/postcss.config.js is not specified and it doesn't parse as CommonJS.
Reparsing as ES module because module syntax was detected. This incurs a performance overhead.
To eliminate this warning, add "type": "module" to /Volumes/edata/vscode/remix-new/package.json.
(Use `node --trace-warnings ...` to show where the warning was created)
➜ Local: http://localhost:5173/
➜ Network: use --host to expose
➜ press h + enter to show help
I renamed vite.config.ts to vite.config.mts and that seemed to hush the error.