Build Error (Bundler) webpack returned errors to ember-auto-import

I installed an npm package and when I try to import the moue into the app, I get below webpack build error. Any ideas on what’s wrong with the import? I’m using ember-cli v3.17.0.

Here’s the error.dump.*.log output

ERROR Summary:

  • broccoliBuilderErrorStack: Error: webpack returned errors to ember-auto-import

    at webpack.run (E:\bpress_django_ember\client\node_modules\ember-auto-import\js\webpack.js:202:32)

    at finalCallback (E:\bpress_django_ember\client\node_modules\webpack\lib\Compiler.js:214:39)

    at hooks.done.callAsync.err (E:\bpress_django_ember\client\node_modules\webpack\lib\Compiler.js:263:14)

    at AsyncSeriesHook.eval [as callAsync] (eval at create (E:\bpress_django_ember\client\node_modules\tapable\lib\HookCodeFactory.js:33:10), :6:1)

    at emitRecords.err (E:\bpress_django_ember\client\node_modules\webpack\lib\Compiler.js:261:22)

    at Compiler.emitRecords (E:\bpress_django_ember\client\node_modules\webpack\lib\Compiler.js:375:39)

    at emitAssets.err (E:\bpress_django_ember\client\node_modules\webpack\lib\Compiler.js:255:10)

    at hooks.afterEmit.callAsync.err (E:\bpress_django_ember\client\node_modules\webpack\lib\Compiler.js:361:14)

    at AsyncSeriesHook.eval [as callAsync] (eval at create (E:\bpress_django_ember\client\node_modules\tapable\lib\HookCodeFactory.js:33:10), :15:1)

    at asyncLib.forEach.err (E:\bpress_django_ember\client\node_modules\webpack\lib\Compiler.js:358:27)

  • code: [undefined]

  • codeFrame: webpack returned errors to ember-auto-import

  • errorMessage: webpack returned errors to ember-auto-import

    at Bundler
    

-~- created here: -~-

at new Plugin (E:\bpress_django_ember\client\node_modules\broccoli-plugin\index.js:7:31)

at new Bundler (E:\bpress_django_ember\client\node_modules\ember-auto-import\js\bundler.js:32:9)

at AutoImport.makeBundler (E:\bpress_django_ember\client\node_modules\ember-auto-import\js\auto-import.js:62:16)

at AutoImport.addTo (E:\bpress_django_ember\client\node_modules\ember-auto-import\js\auto-import.js:72:38)

at EmberApp.host.addonPostprocessTree (E:\bpress_django_ember\client\node_modules\ember-auto-import\js\auto-import.js:106:29)

at EmberApp.toTree (E:\bpress_django_ember\client\node_modules\ember-cli\lib\broccoli\ember-app.js:1669:17)

at module.exports (E:\bpress_django_ember\client\ember-cli-build.js:23:14)

at Builder.readBuildFile (E:\bpress_django_ember\client\node_modules\ember-cli\lib\models\builder.js:49:14)

at Builder.setupBroccoliBuilder (E:\bpress_django_ember\client\node_modules\ember-cli\lib\models\builder.js:63:22)

at new Builder (E:\bpress_django_ember\client\node_modules\ember-cli\lib\models\builder.js:29:10)

-~- (end) -~-

  • errorType: Build Error

  • location:

    • column: [undefined]

    • file: [undefined]

    • line: [undefined]

    • treeDir: [undefined]

  • message: webpack returned errors to ember-auto-import

    at Bundler
    

-~- created here: -~-

at new Plugin (E:\bpress_django_ember\client\node_modules\broccoli-plugin\index.js:7:31)

at new Bundler (E:\bpress_django_ember\client\node_modules\ember-auto-import\js\bundler.js:32:9)

at AutoImport.makeBundler (E:\bpress_django_ember\client\node_modules\ember-auto-import\js\auto-import.js:62:16)

at AutoImport.addTo (E:\bpress_django_ember\client\node_modules\ember-auto-import\js\auto-import.js:72:38)

at EmberApp.host.addonPostprocessTree (E:\bpress_django_ember\client\node_modules\ember-auto-import\js\auto-import.js:106:29)

at EmberApp.toTree (E:\bpress_django_ember\client\node_modules\ember-cli\lib\broccoli\ember-app.js:1669:17)

at module.exports (E:\bpress_django_ember\client\ember-cli-build.js:23:14)

at Builder.readBuildFile (E:\bpress_django_ember\client\node_modules\ember-cli\lib\models\builder.js:49:14)

at Builder.setupBroccoliBuilder (E:\bpress_django_ember\client\node_modules\ember-cli\lib\models\builder.js:63:22)

at new Builder (E:\bpress_django_ember\client\node_modules\ember-cli\lib\models\builder.js:29:10)

-~- (end) -~-

  • name: Error

  • nodeAnnotation: [undefined]

  • nodeName: Bundler

  • originalErrorMessage: webpack returned errors to ember-auto-import

  • stack: Error: webpack returned errors to ember-auto-import

    at webpack.run (E:\bpress_django_ember\client\node_modules\ember-auto-import\js\webpack.js:202:32)

    at finalCallback (E:\bpress_django_ember\client\node_modules\webpack\lib\Compiler.js:214:39)

    at hooks.done.callAsync.err (E:\bpress_django_ember\client\node_modules\webpack\lib\Compiler.js:263:14)

    at AsyncSeriesHook.eval [as callAsync] (eval at create (E:\bpress_django_ember\client\node_modules\tapable\lib\HookCodeFactory.js:33:10), :6:1)

    at emitRecords.err (E:\bpress_django_ember\client\node_modules\webpack\lib\Compiler.js:261:22)

    at Compiler.emitRecords (E:\bpress_django_ember\client\node_modules\webpack\lib\Compiler.js:375:39)

    at emitAssets.err (E:\bpress_django_ember\client\node_modules\webpack\lib\Compiler.js:255:10)

    at hooks.afterEmit.callAsync.err (E:\bpress_django_ember\client\node_modules\webpack\lib\Compiler.js:361:14)

    at AsyncSeriesHook.eval [as callAsync] (eval at create (E:\bpress_django_ember\client\node_modules\tapable\lib\HookCodeFactory.js:33:10), :15:1)

    at asyncLib.forEach.err (E:\bpress_django_ember\client\node_modules\webpack\lib\Compiler.js:358:27)

=================================================================================

fs and crypto are modules built into NodeJS, but they’re not available on the web (so not available in your ember app).

If you would like to polyfill them, you can add automatic polyfills like this:

// In your ember-cli-build.js file
let app = new EmberApp(defaults, {
  autoImport: {
    webpack: { 
      node: { 
        fs: true,
        crypto: true,
      }
  }
})

We don’t include them by default because adding big polyfills to your app automagically can be surprising.

@ef4 added the automatic polyfill snippet as suggested and got the following error:

Build Error (Bundler) No browser version for node.js core module fs available

Looks like there’s no webpack polyfill option for fs module? I updated to fs: ‘empty’ and that compiled without any errors, but don’t know if that will cause issues downstream.

Oh yes, fs can’t be polyfilled (for pretty obvious reasons when you think about it).

Whether that will break depends on whether the library you’re using actually tries to call fs or if it just imports it but doesn’t call it.

@ef4 Looks like the library does try to call fs. Any other way to workaround the polyfill limitation for fs?

else if (path.lastIndexOf(‘http’, 0) !== 0) { try { return require(‘fs’).promises.readFile(path, ‘utf8’).then((d) => JSON.parse(d)); } catch (e) { return null; }

That code will only try to use fs if the path you give it doesn’t start with http. So I would guess as long as you only ask the library to open URLs you will be ok.

Yeap, that works. Thanks!