Compilation error when testing

[FlorianDr]

Hey there,
I'm seeking help with my setup. I ran the following versions:

• webpack@4.25.1
• mocha@5.2.0
• mocha-webpack@2.0.0-beta.0 (also on v1)

Webpack works pretty fine in development and production producing bundles as wanted. But I don't get it to run with the command "mocha-webpack". Always getting the following compilation error:

 WEBPACK  Failed to compile with 3 error(s)

Error in ./app/public/src/js/store/user.js

  Module parse failed: 'import' and 'export' may only appear at the top level (1099:4)
  You may need an appropriate loader to handle this file type.
  |     }();
  |
  >     import "core-js/modules/es6.promise";
  |     import "core-js/modules/es6.string.iterator";
  |     import "core-js/modules/es6.array.from";

It looks like stuff injected by babel-polyfills, but when I leave it out, I get the same error in a different spot.

Thank you for your help!

[udebella]

Hello,

I'm maybe wrong but I think mocha-webpack is running your tests with the direct source code in nodejs environment. It does not use the output from webpack.
In vuejs documentation, they setup babel loader to transpile imports. It may solve your problem.

[elecay]

Ey @FlorianDr, have you been able to solve this? Thx!

[FlorianDr]

@elecay sorry for the late reply. I did some adjustments and it got it work. I changed the output of babel in my test environment to be commonjs modules and the type of the env preset. It's still black magic to me and I should investigate more:

"test": {
      "presets": [
        [
          "@babel/preset-env",
          {
            "useBuiltIns": "entry",
            "modules": "cjs"
          }
        ]
      ]
    }

[elecay]

Thanks for the response @FlorianDr; we will try that. 👌