routes-gen icon indicating copy to clipboard operation
routes-gen copied to clipboard

Error [ERR_REQUIRE_ESM] When using with an esm based npm project.

Open mikedklein opened this issue 1 year ago • 0 comments

Describe the bug

When running routes-gen with a setup that is all ESM based I get the following error.

Error [ERR_REQUIRE_ESM]: require() of ES Module /<myproject_path>/remix.config.js from /<myproject_path>/node_modules/@routes-gen/remix/dist/index.js not supported.
Instead change the require of remix.config.js in /<myproject_path>/node_modules/@routes-gen/remix/dist/index.js to a dynamic import() which is available in all CommonJS modules.
    at loadRemixConfig (/<myproject_path>/node_modules/@routes-gen/remix/dist/index.js:46:14)
    at Object.<anonymous> (/<myproject_path>/node_modules/@routes-gen/remix/dist/index.js:59:21)
    at //<myproject_path>/node_modules/routes-gen/dist/cli.js:142:118
    at async bootstrap (/<myproject_path>/node_modules/routes-gen/dist/cli.js:142:14) {
  code: 'ERR_REQUIRE_ESM'
}
Failed to load the Remix config at "remix.config.js". Falling back to the following defaults: {"appDirectory":"app"}.
[SUCCESS] Exported 100 routes to "app/routes.d.ts".

So it doesn't actually fail but I was able to easily remedy this with changing a couple lines of the built remix driver in the dist index.js file to use dynamic import instead.

...
    try {
      const configFile = await import(file);
      return configFile.default;
    } catch (e) {
...

I believe changing this https://github.com/sandulat/routes-gen/blob/32c50bb2489b16231e637d68ea1ed74e7ea7cb72/packages/routes-gen-remix/src/index.ts#L25 to be a dynamic import would solve it although I am unsure if that would have ramifications for other users sticking strictly to commonjs. Looking at the error it shouldn't.

Happy to help work on the problem and test the solution out if needed.

Your Example Website or App

https://stackblitz.com/edit/remix-run-remix-j9fqdd

Steps to Reproduce the Bug or Issue

  1. run npm run gen-routes from the terminal in the example app and you can see the error

Expected behavior

clean output e.g.

npm run gen-routes

> gen-routes
> routes-gen -d @routes-gen/remix

[SUCCESS] Exported 100 routes to "app/routes.d.ts".

Screenshots or Videos

No response

Platform

  • OS: macOS
  • Browser: Chrome
  • Version: "routes-gen": "^0.6.1", "@routes-gen/remix": "^0.3.7",

Additional context

No response

mikedklein avatar Dec 18 '23 19:12 mikedklein