I am new to webpack and attempting to use it together with the Babel loader to write a library in ES6. I also want to use Karma/PhantomJS for a testing pipeline.
I have hit an odd issue where PhantomJS indicates that ES6 code didn't get converted when I run the tests:
SyntaxError: Use of reserved word 'let' in strict mode
at webpack:///say/hello.js:2:0 <- say/hello.spec.js:22929
But this only happens when I export my webpack config as a function (to take advantage of environment as per https://webpack.js.org/configuration/configuration-types/#exporting-a-function-to-use-env). Exporting config as an object is fine.
I have made a public repo to help others reproduce this at https://github.com/agentreno/es6-library-example with the npm 'test' and 'test:broken' tasks to demonstrate. I would greatly appreciate any assistance.
The problem is not the webpack config, but how you use it in your karma.config on line 37. The webpack option in the karma config expects an object, but you're giving it a function. You actually need to call the function to get the resulting object, which webpack usually does for you when you run webpack from the command line.
As you're not currently using env (the input parameter to the webpack function), you can simply call it:
webpack: webpackConfig(),
But when you start having conditions based on this, you'd need to pass the correct values. Let's say you're using the example mentioned in the docs: --env.production and --env.platform=web. Webpack will call the function as follows:
webpackConfig({ production: true, target: 'web' })