Bundle error

[montogeek]

After adding this plugin to my wp config i get the following error:

montogeek ~/project [02:30 PM]→ 😀  (feat/tests-ci)
👉  NODE_ENV=production yarn build
yarn build v0.24.4
$ rm -rf dist/* && npm run build:client

> project@1.0.0 build:client /Users/montogeek/project
> webpack --config webpack.config.js --display-error-details --display-used-exports

Hash: 261625c02a2a1e40084c
Version: webpack 2.6.1
Time: 1004ms
        Asset       Size  Chunks             Chunk Names
    bundle.js    4.92 kB       0  [emitted]  main
bundle.js.map    10.7 kB       0  [emitted]  main
   index.html  697 bytes          [emitted]
   [0] ./main.js 4.35 kB {0} [built] [failed] [1 error]
   [1] multi ./main.js 28 bytes {0} [built]

ERROR in ./main.js
Module parse failed: /Users/montogeek/project/node_modules/babel-loader/lib/index.js!/Users/montogeek/project/src/main.js ImportDeclaration should appear when the mode is ES6 and in the module context.
You may need an appropriate loader to handle this file type.
AssertionError: ImportDeclaration should appear when the mode is ES6 and in the module context.
    at Referencer.ImportDeclaration (/Users/montogeek/project/node_modules/escope/lib/referencer.js:591:34)
    at Referencer.Visitor.visit (/Users/montogeek/project/node_modules/esrecurse/esrecurse.js:122:34)
    at Referencer.Visitor.visitChildren (/Users/montogeek/project/node_modules/esrecurse/esrecurse.js:101:38)
    at Referencer.Program (/Users/montogeek/project/node_modules/escope/lib/referencer.js:419:18)
    at Referencer.Visitor.visit (/Users/montogeek/project/node_modules/esrecurse/esrecurse.js:122:34)
    at Object.analyze (/Users/montogeek/project/node_modules/escope/lib/index.js:153:16)
    at Analyzer.gather (/Users/montogeek/project/node_modules/common-shake/lib/shake/analyzer.js:45:26)
    at Analyzer.run (/Users/montogeek/project/node_modules/common-shake/lib/shake/analyzer.js:34:8)
    at Parser.parser.plugin (/Users/montogeek/project/node_modules/webpack-common-shake/lib/shake/plugin.js:15:19)
    at Parser.applyPluginsBailResult (/Users/montogeek/project/node_modules/tapable/lib/Tapable.js:109:27)
    at Parser.parse (/Users/montogeek/project/node_modules/webpack/lib/Parser.js:1358:11)
    at doBuild (/Users/montogeek/project/node_modules/webpack/lib/NormalModule.js:288:17)
    at runLoaders (/Users/montogeek/project/node_modules/webpack/lib/NormalModule.js:206:11)
    at /Users/montogeek/project/node_modules/loader-runner/lib/LoaderRunner.js:370:3
    at iterateNormalLoaders (/Users/montogeek/project/node_modules/loader-runner/lib/LoaderRunner.js:211:10)
    at iterateNormalLoaders (/Users/montogeek/project/node_modules/loader-runner/lib/LoaderRunner.js:218:10)
    at /Users/montogeek/project/node_modules/loader-runner/lib/LoaderRunner.js:233:3
    at Object.context.callback (/Users/montogeek/project/node_modules/loader-runner/lib/LoaderRunner.js:111:13)
    at Object.module.exports (/Users/montogeek/project/node_modules/babel-loader/lib/index.js:172:8)
    at LOADER_EXECUTION (/Users/montogeek/project/node_modules/loader-runner/lib/LoaderRunner.js:119:14)
    at runSyncOrAsync (/Users/montogeek/project/node_modules/loader-runner/lib/LoaderRunner.js:120:4)
    at iterateNormalLoaders (/Users/montogeek/project/node_modules/loader-runner/lib/LoaderRunner.js:229:2)
    at Array.<anonymous> (/Users/montogeek/project/node_modules/loader-runner/lib/LoaderRunner.js:202:4)
    at Storage.finished (/Users/montogeek/project/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:38:15)
    at /Users/montogeek/project/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:69:9
    at /Users/montogeek/project/node_modules/graceful-fs/graceful-fs.js:78:16
    at FSReqWrap.readFileAfterClose [as oncomplete] (fs.js:439:3)
 @ multi ./main.js
Child html-webpack-plugin for "index.html":
       [0] ../~/lodash/lodash.js 540 kB {0} [built]
       [1] ../~/html-webpack-plugin/lib/loader.js!./index.ejs 1.41 kB {0} [built]
       [2] ../~/webpack/buildin/global.js 509 bytes {0} [built]
       [3] ../~/webpack/buildin/module.js 517 bytes {0} [built]
npm ERR! code ELIFECYCLE
npm ERR! errno 2
npm ERR! project@1.0.0 build:client: `webpack --config webpack.config.js --display-error-details --display-used-exports`
npm ERR! Exit status 2
npm ERR!
npm ERR! Failed at the project@1.0.0 build:client script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/montogeek/.npm/_logs/2017-06-28T19_30_56_471Z-debug.log
error Command failed with exit code 2.

webpack.config.js

const prodConfig = {
  entry: {
    main: ['./main.js']
  },
  context: path.resolve(__dirname, 'src'),
  output: {
    filename: 'bundle.js',
    path: path.resolve(__dirname, 'dist')
  },
  devtool: 'source-map',
  module: {
    rules: [
      {
        test: /\.js$/,
        exclude: /node_modules/,
        loader: 'babel-loader'
      },
      {
        test: /\.css$/,
        use: ExtractTextPlugin.extract({
          fallback: 'style-loader',
          use: [
            {
              loader: 'css-loader',
              options: {
                minimize: true
              }
            },
            {
              loader: 'postcss-loader'
            }
          ]
        })
      },
      {
        test: /\.(png|jpg|gif|eot|ttf|woff|woff2)$/,
        loader: 'url-loader',
        options: {
          limit: 10000
        }
      },
      {
        test: /\.svg$/,
        use: 'raw-loader'
      }
    ]
  },
  plugins: [
    new webpack.DefinePlugin({
      'process.env': { NODE_ENV: JSON.stringify('production') },
      HOST: JSON.stringify(host)
    }),
    new ExtractTextPlugin('styles.css'),
    new HtmlWebpackPlugin({
      template: './index.ejs',
      files: {
        css: ['style.css'],
        js: ['bundle.js']
      },
      frameTrackerContentUrl: frameTrackerContentUrl,
      production: true
    }),
    new webpack.optimize.UglifyJsPlugin({
      compress: { warnings: false },
      sourceMap: true
    }),
    new ShakePlugin()
  ]
}

main.js

import React from 'react'
import ReactDOM from 'react-dom'
import { AppContainer } from 'react-hot-loader'
import App from './containers/App'

const rootEle = document.getElementById('app')

const onConfigurationLoaded = callback => {
  let configurationLoadedTimer = setInterval(() => {
    if (window.globalThing && window.globalThing) {
      clearInterval(configurationLoadedTimer)
      callback()
    }
  }, 100)
}

const render = Component => {
  ReactDOM.render(
    <AppContainer>
      <Component />
    </AppContainer>,
    rootEle
  )
}

onConfigurationLoaded(() => {
  render(App)
})

if (module.hot) {
  module.hot.accept('./containers/App', () => {
    render(App)
  })
}

npm@4.6.1 node@v7.7.4 webpack 2.6.1

Looks like it is overriden loaders configuration?

[indutny]

I'm not sure this really works with webpack@2. May I ask you try webpack@3 and also fresh alpha1 of this library?

Thanks!

[montogeek]

I got a bit busy, will try in a hour

[indutny]

Hopefully fixed in v1.0.0-alpha2, please give it a try.

[drcmda]

@indutny I still get it (webpack3 / alpha4)

ERROR in ./polyfills.js
Module parse failed: /Users/drcmda/dev/polygons/node_modules/babel-loader/lib/index.js??ref--0!/Users/drcmda/dev/polygons/polyfills.js ImportDeclaration should appear when the mode is ES6 and in the module context.
You may need an appropriate loader to handle this file type.
AssertionError [ERR_ASSERTION]: ImportDeclaration should appear when the mode is ES6 and in the module context.
    at Referencer.ImportDeclaration (/Users/drcmda/dev/polygons/node_modules/escope/lib/referencer.js:591:34)
    at Referencer.Visitor.visit (/Users/drcmda/dev/polygons/node_modules/esrecurse/esrecurse.js:122:34)
    at Referencer.Visitor.visitChildren (/Users/drcmda/dev/polygons/node_modules/esrecurse/esrecurse.js:101:38)
    at Referencer.Program (/Users/drcmda/dev/polygons/node_modules/escope/lib/referencer.js:419:18)
    at Referencer.Visitor.visit (/Users/drcmda/dev/polygons/node_modules/esrecurse/esrecurse.js:122:34)
    at Object.analyze (/Users/drcmda/dev/polygons/node_modules/escope/lib/index.js:153:16)
    at Analyzer.gather (/Users/drcmda/dev/polygons/node_modules/common-shake/lib/shake/analyzer.js:45:26)
    at Analyzer.run (/Users/drcmda/dev/polygons/node_modules/common-shake/lib/shake/analyzer.js:34:8)
    at Parser.parser.plugin (/Users/drcmda/dev/polygons/node_modules/webpack-common-shake/lib/shake/plugin.js:17:19)
    at Parser.applyPluginsBailResult (/Users/drcmda/dev/polygons/node_modules/tapable/lib/Tapable.js:109:27)
    at Parser.parse (/Users/drcmda/dev/polygons/node_modules/webpack/lib/Parser.js:1366:11)
    at doBuild (/Users/drcmda/dev/polygons/node_modules/webpack/lib/NormalModule.js:293:17)
    at runLoaders (/Users/drcmda/dev/polygons/node_modules/webpack/lib/NormalModule.js:207:11)
    at /Users/drcmda/dev/polygons/node_modules/loader-runner/lib/LoaderRunner.js:370:3
    at iterateNormalLoaders (/Users/drcmda/dev/polygons/node_modules/loader-runner/lib/LoaderRunner.js:211:10)
    at iterateNormalLoaders (/Users/drcmda/dev/polygons/node_modules/loader-runner/lib/LoaderRunner.js:218:10)
    at /Users/drcmda/dev/polygons/node_modules/loader-runner/lib/LoaderRunner.js:233:3
    at context.callback (/Users/drcmda/dev/polygons/node_modules/loader-runner/lib/LoaderRunner.js:111:13)
    at /Users/drcmda/dev/polygons/node_modules/babel-loader/lib/index.js:170:14
    at /Users/drcmda/dev/polygons/node_modules/babel-loader/lib/fs-cache.js:113:24
    at /Users/drcmda/dev/polygons/node_modules/babel-loader/lib/fs-cache.js:44:14
    at Gunzip.onEnd (zlib.js:130:5)
    at emitNone (events.js:110:20)
    at Gunzip.emit (events.js:207:7)
    at endReadableNT (_stream_readable.js:1047:12)
    at _combinedTickCallback (internal/process/next_tick.js:102:11)
    at process._tickCallback (internal/process/next_tick.js:161:9)
 @ multi polyfills.js index.js

[indutny]

I'm sorry! Should be fixed in alpha5!

[drcmda]

I'm afraid it's still in there, this is alpha6

ERROR in ./routes/Default.js
Module parse failed: /Users/drcmda/dev/polygons/node_modules/babel-loader/lib/index.js??ref--0!/Users/drcmda/dev/polygons/routes/Default.js Unknown node type Import.
You may need an appropriate loader to handle this file type.
Error: Unknown node type Import.
    at Controller.traverse (/Users/drcmda/dev/polygons/node_modules/estraverse/estraverse.js:521:31)
    at Object.traverse (/Users/drcmda/dev/polygons/node_modules/estraverse/estraverse.js:713:27)
    at Analyzer.sift (/Users/drcmda/dev/polygons/node_modules/common-shake/lib/shake/analyzer.js:210:14)
    at Analyzer.run (/Users/drcmda/dev/polygons/node_modules/common-shake/lib/shake/analyzer.js:40:8)
    at Parser.parser.plugin (/Users/drcmda/dev/polygons/node_modules/webpack-common-shake/lib/shake/plugin.js:26:25)

That's how Default.js looks like:

import React from 'react';

export default class extends React.PureComponent {
    static contextTypes = { session: React.PropTypes.object };

    componentDidMount() {
        let session = this.context.session;

        // Lazy load plugins. Webpack will create separate bundles for these ...
        session.resolveDefaultFeaturePlugin(import('awv3/plugins/members/'));
        session.resolveFeaturePlugin(import('awv3/plugins/sketcher/'), 'CC_Sketch');
        session.resolveFeaturePlugin(import('awv3/plugins/import/'), 'CC_StreamImport');
        session.resolveFeaturePlugin(import('awv3/plugins/csys/'), 'CC_WorkCoordSystem', 'CoordSystem');
        session.resolveFeaturePlugin(import('awv3/plugins/workplane/'), 'CC_WorkPlane');
        session.resolveFeaturePlugin(import('awv3/plugins/extrusion/'), 'CC_Extrusion');
        session.resolveGlobalPlugins(
            import('awv3/plugins/test/'),
            //import('awv3/plugins/json/'),
            import('awv3/plugins/measure/'),
            import('awv3/plugins/color/'),
            import('awv3/plugins/debugseq/'),
            import('awv3/plugins/dimensions/'),
            import('awv3/plugins/interpreter/'),
            import('awv3/plugins/shader/'),
            import('awv3/plugins/properties/'),
        );
    }
    render () {
        return null;
    }
}

Also new messages that weren't there before:

    WARNING in /Users/drcmda/dev/polygons/node_modules/css-loader/lib/css-base.js from webpack-common-shake
    `module.exports` assignment at [/Users/drcmda/dev/polygons/node_modules/css-loader/lib/css-base.js:6:0]
Child extract-text-webpack-plugin:
       2 modules

It went way further than last time, though.

[indutny]

Oooh, dynamic imports: https://github.com/kesne/acorn-dynamic-import/blob/master/src/inject.js#L15 ... Will fix it in a bit.

[indutny]

I think it should be fixed as of alpha7. Please give it a try!

As for warnings, these are kind of normal... It just tells which modules were not optimized used this plugin, and describes the reason for it.

It should not probably print this on module.exports assignment, though. As it is very common.

[indutny]

Closing this in absence of activity :wink: Please let me know if you'll have any luck with this.

Thank you!