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

Dynamic import of optional dep from addon gives runtime "could not find module" error #551

Open
abeforgit opened this issue Dec 3, 2022 · 1 comment

Comments

@abeforgit
Copy link

abeforgit commented Dec 3, 2022

I'm making a V1 ember addon, and I'm trying to dynamically import a non-ember npm package: prosemirror-dev-tools

I followed the instructions as per the readme, but while everything builds fine, I get a runtime error in the dummy app:

Uncaught (in promise) Error: Could not find module `_eai_dyn_prosemirror-dev-tools` imported from `(require)`
   at missingModule (loader.js:247:1)
   at findModule (loader.js:258:1)
   at requireModule (loader.js:24:1)
   at module.exports.window.emberAutoImportDynamic (app.cjs:7:14)
   at new Prosemirror (prosemirror.ts:188:7)
   at RdfaEditor.handleRawEditorInit (rdfa-editor.ts:119:24)

(the last two lines of the stacktrace are my files)
The usecase is that I'm trying to add the devtools as an optional dependency. The following code runs to check if it's available:

    if (devtools) {
      import('prosemirror-dev-tools').then(
        ({ default: applyDevTools }) => {
          applyDevTools(this.view);
        },
        () => {
          this.logger(
            'optional dependency prosemirror-dev-tools is not installed'
          );
        }
      );
    }

The idea being that I can avoid the bundle size increase in production.

Important: I'm getting the error whether or not the dependency is installed

However, I'm not getting the error when I make devtools false, skipping the dynamic import block altogether. So at least that's working as expected.

Potentially relevant versions:

ember-auto-import : 2.5.0
ember-source: 3.28.8
ember-cli: 3.28.5
ember-cli-typescript: 5.1.0

my full index.js file:

'use strict';

module.exports = {
  isDevelopingAddon() {
    return process.env.EMBER_ENV === 'development';
  },
  name: require('./package').name,
  options: {
    babel: {
      sourceMaps: 'inline',
      plugins: [require.resolve('ember-auto-import/babel-plugin')],
    },
    autoImport: {
      webpack: {
        node: {
          global: true,
          __filename: true,
          __dirname: true,
        },
        resolve: {
          fallback: {
            stream: require.resolve('stream-browserify'),
            crypto: require.resolve('crypto-browserify'),
          },
        },
      },
    },
  },

  included: function (app) {
    this._super.included.apply(this, arguments);

    app.options.sassOptions = app.options.sassOptions || {};
    app.options.sassOptions.includePaths =
      app.options.sassOptions.includePaths || [];
  },
};
@abeforgit
Copy link
Author

Incidentally, if I can rely on tree-shaking (can I?), I could just static import and just not call the applyDevTools function.
That still leaves this as a bug though

@abeforgit abeforgit changed the title Dynamic import from addon gives runtime "could not find module" error Dynamic import of optional dep from addon gives runtime "could not find module" error Dec 3, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant