Invalid driver package name or file path.

[danestves]

Describe the bug

I installed the dependencies using npm add routes-gen @routes-gen/remix and run routes-gen -d @routes-gen/remix and I get the following error

Your Example Website or App

Private Repo

Steps to Reproduce the Bug or Issue

1. Install dependencies with npm
2. Run the script with npm

Expected behavior

Generate the routes

Screenshots or Videos

No response

Platform

• OS: macOS
• Browser: Chrome
• Version: 108.0

Additional context

No response

[sandulat]

@danestves what is nr? If you use npm run build:routes2, do you still encounter the issue?

Besides that, are you using a monorepo? If so, with what tooling?

[danestves]

No monorepo and nr is an alias for npm run, and yeah, both give me that error

[sandulat]

@danestves Make sure you run the script in the root of your project. Also try these: npx routes-gen -d @routes-gen/remix npx routes-gen -d node_modules/@routes-gen/remix yarn routes-gen -d @routes-gen/remix

[sandulat]

@danestves Also check if @routes-gen/remix actually exists in your node_modules.

[sandulat]

@danestves Did you manage to figure this one out? Do you still encounter the issue?

[mikeybinns]

I'm running into the same issue, I am definitely in the project root and have run both the npm commands you mentioned with the same result. @routes-gen/remix is definitely installed.

[sandulat]

@mikeybinns could you please navigate to node_modules/routes-gen/dist/cli.js and add this console log at line 143? I cannot reproduce it myself so I might need some help here.

  try {
    driver = await (function (t) { return Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require(t)); }); })(require.resolve(cli.flags.driver));
  } catch (e) {
+   console.log(e, require.resolve(cli.flags.driver));
  }

[sandulat]

@mikeybinns also please try to remove require.resolve from line 141 and see if that helps:

  try {
-     driver = await (function (t) { return Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require(t)); }); })(require.resolve(cli.flags.driver));
+     driver = await (function (t) { return Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require(t)); }); })(cli.flags.driver);
  } catch (e) {
  }

[sandulat]

@mikeybinns perhaps also try to remove the _interopNamespace function from line 141:

  try {
-     driver = await (function (t) { return Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require(t)); }); })(require.resolve(cli.flags.driver));
+     driver = await (function (t) { return Promise.resolve().then(function () { return /*#__PURE__*/require(t); }); })(require.resolve(cli.flags.driver));
  } catch (e) {
  }

[mikeybinns]

Hi, sorry for the delay in getting back to you.

I think I've narrowed down the issue now thanks to the console log from your first comment.

I have set "type":"module", in my package.json file, which means all files with the .js extension are treated as ESM.

require() of ES Module /Users/mikey/Websites/Personal/mikeybinns/remix.config.js from /Users/mikey/Websites/Personal/mikeybinns/node_modules/@routes-gen/remix/dist/index.js not supported.
remix.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 rename remix.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 /Users/mikey/Websites/Personal/mikeybinns/package.json to treat all .js files as CommonJS (using .mjs for all ES modules instead).

I tried changing the file extension as the error message mentions (because the contents is definitely commonjs) but then I encounter this issue:

Error: Cannot find module '/Users/mikey/Websites/Personal/mikeybinns/remix.config.js'

Since v1.6.8, remix.config supports both cjs and mjs file extensions, so I would recommend checking for each of these extensions before you throw an error because of a missing config file.

I believe by adding support for these file extensions, it should resolve our issue. (@danestves don't forget to changes your file extensions to .cjs if they contain module.exports, or update the code inside the file to ESM code).

[sandulat]

@mikeybinns Thanks a lot! I'll release a fix this week.

[sandulat]

@mikeybinns @danestves The fix is published under @routes-gen/remix@0.3.6 PR https://github.com/sandulat/routes-gen/pull/34.

Summarising in short:

• When type is not set, or is set to commonjs in package.json, the config has to be named remix.config.js or remix.config.cjs.
• When type is set to module in package.json, the config has to be named remix.config.cjs.
• remix.config.mjs is currently unsupported, since I didn't have enough time to research how to universally transpile the import of the config. Still, if you use the .mjs extension, routes parsing will not fail, but note that the config will fallback to { appDirectory: "app" }.

Thanks a lot @danestves @mikeybinns!

[mikeybinns]

If your source code is already ESM, you can import cjs and ESM the same way. It's that easy.

If your source code is using cjs and you don't want to convert it to esm, you won't be able to use require, instead you have to use dynamic import. It's probably not as complex as you think, this article explains it pretty well. https://adamcoster.com/blog/commonjs-and-esm-importexport-compatibility-examples

In short, you can try to require it in a try catch block, and if that fails, import it instead.

[sandulat]

@mikeybinns The issue is that Rollup transpiles dynamic imports back to require in the bundle, so I have yet to figure this one out.

[mikeybinns]

Ah okay 👍

[entropitor]

I'm encountering this bug as well. I didn't have a remix config file given I'm on v2: https://remix.run/docs/en/main/file-conventions/remix-config