webpack-bundle
webpack-bundle copied to clipboard
mariusbalcytis
Production compilation error
Issue:
I get the following error when I run app/console maba:webpack:compile --env=prod I only get the error when I use the --env=prod option to deploy for production
What should I do to fix this?
Command Output
(node:24503) DeprecationWarning: loaderUtils.parseQuery() received a non-string value which can be problematic, see https://github.com/webpack/loader-utils/issues/56
parseQuery() will be replaced with getOptions() in the next major version of loader-utils.
Hash: c5d914d044be92554065
Version: webpack 2.7.0
Time: 2455ms
[6] ./~/fbjs/lib/ExecutionEnvironment.js 1.06 kB {0} [built]
[8] ./~/react-dom/lib/ReactInstrumentation.js 601 bytes {0} [built]
[10] ./~/react-dom/lib/ReactUpdates.js 9.53 kB {0} [built]
[18] ./~/react/lib/React.js 5.08 kB {0} [built]
[82] ./src/XXXX/BusinessBundle/Resources/public/js/Edfa3lyReactApp/products.js 641 bytes {0} [built]
[83] ./src/XXXX/BusinessBundle/Resources/public/js/Edfa3lyReactApp/main.js 25 bytes {0} [built]
[102] ./~/react-dom/index.js 59 bytes {0} [built]
[116] ./~/react-dom/lib/ReactDOM.js 5.17 kB {0} [built]
[165] ./~/react-dom/lib/findDOMNode.js 2.46 kB {0} [built]
[172] ./~/react-dom/lib/renderSubtreeIntoContainer.js 422 bytes {0} [built]
[175] ./~/react/lib/ReactChildren.js 6.19 kB {0} [built]
[176] ./~/react/lib/ReactDOMFactories.js 5.48 kB {0} [built]
[178] ./~/react/lib/ReactPropTypes.js 500 bytes {0} [built]
[180] ./~/react/lib/ReactVersion.js 350 bytes {0} [built]
[186] ./~/react/react.js 56 bytes {0} [built]
+ 172 hidden modules
ERROR in main-e496dac1f5b908fe1cfc0ea9a07813ac984aee6c.8462e0b2df4475db7479.js from UglifyJs
Unexpected token: name (Welcome) [main-e496dac1f5b908fe1cfc0ea9a07813ac984aee6c.8462e0b2df4475db7479.js:9851,6]
[Symfony\Component\Process\Exception\ProcessFailedException]
The command "'node_modules/.bin/webpack' '--config' '/var/www/html/RockStar/app/cache/prod/webpack.config.js'" failed.
Exit Code: 2(Misuse of shell builtins)
Output:
================
Hash: c5d914d044be92554065
Version: webpack 2.7.0
Time: 2455ms
[6] ./~/fbjs/lib/ExecutionEnvironment.js 1.06 kB {0} [built]
[8] ./~/react-dom/lib/ReactInstrumentation.js 601 bytes {0} [built]
[10] ./~/react-dom/lib/ReactUpdates.js 9.53 kB {0} [built]
[18] ./~/react/lib/React.js 5.08 kB {0} [built]
[82] ./src/XXXX/BusinessBundle/Resources/public/js/Edfa3lyReactApp/products.js 641 bytes {0} [built]
[83] ./src/XXXX/BusinessBundle/Resources/public/js/Edfa3lyReactApp/main.js 25 bytes {0} [built]
[102] ./~/react-dom/index.js 59 bytes {0} [built]
[116] ./~/react-dom/lib/ReactDOM.js 5.17 kB {0} [built]
[165] ./~/react-dom/lib/findDOMNode.js 2.46 kB {0} [built]
[172] ./~/react-dom/lib/renderSubtreeIntoContainer.js 422 bytes {0} [built]
[175] ./~/react/lib/ReactChildren.js 6.19 kB {0} [built]
[176] ./~/react/lib/ReactDOMFactories.js 5.48 kB {0} [built]
[178] ./~/react/lib/ReactPropTypes.js 500 bytes {0} [built]
[180] ./~/react/lib/ReactVersion.js 350 bytes {0} [built]
[186] ./~/react/react.js 56 bytes {0} [built]
+ 172 hidden modules
ERROR in main-e496dac1f5b908fe1cfc0ea9a07813ac984aee6c.8462e0b2df4475db7479.js from UglifyJs
Unexpected token: name (Welcome) [main-e496dac1f5b908fe1cfc0ea9a07813ac984aee6c.8462e0b2df4475db7479.js:9851,6]
Error Output:
================
(node:24503) DeprecationWarning: loaderUtils.parseQuery() received a non-string value which can be problematic, see https://github.com/webpack/lo
ader-utils/issues/56
parseQuery() will be replaced with getOptions() in the next major version of loader-utils.
maba:webpack:compile
Could you give some syntax - what's in main-e496dac1f5b908fe1cfc0ea9a07813ac984aee6c.8462e0b2df4475db7479.js line 9851?
It's either JS syntax error (which would be strange as it get's the file built) or target version of JS is incompatible with UglifyJS plugin. That is, babel producer newer version of JavaScript than UglifyJS plugin can handle.
Could you try to update uglifyjs to see if problem would still persist? It's version is in package.json, update is made with yarn or npm.
I can't find that file in the project and Uglify is not installed included in package.json either. So I don't know if this is a problem and it should've been there or not.
Here is what I did
In webpack.config.js I commented the part of uglify //new webpack.optimize.UglifyJsPlugin() like so
/**
* Build specific plugins - used only in production environment
*/
if (BUILD) {
config.plugins.push(
/**
* Only emit files when there are no errors
* Reference: https://github.com/webpack/docs/wiki/list-of-plugins#noerrorsplugin
*/
new webpack.NoEmitOnErrorsPlugin()
/**
* Minify all javascript, switch loaders to minimizing mode
* Reference: https://webpack.js.org/plugins/uglifyjs-webpack-plugin/
*/
//new webpack.optimize.UglifyJsPlugin()
);
}
This is what I got when I ran compile command again for env=prod
(node:1616) DeprecationWarning: loaderUtils.parseQuery() received a non-string value which can be problematic, see https://github.com/webpack/loader-utils/issues/56
parseQuery() will be replaced with getOptions() in the next major version of loader-utils.
Hash: c5d914d044be92554065
Version: webpack 2.7.0
Time: 2060ms
Asset Size Chunks Chunk Names
main-e496dac1f5b908fe1cfc0ea9a07813ac984aee6c.8462e0b2df4475db7479.js 754 kB 0 [emitted] [big] main-e496dac1f5b908fe1cfc0ea9a07813ac984aee6c
main-e496dac1f5b908fe1cfc0ea9a07813ac984aee6c.8462e0b2df4475db7479.js.map 900 kB 0 [emitted] main-e496dac1f5b908fe1cfc0ea9a07813ac984aee6c
[6] ./~/fbjs/lib/ExecutionEnvironment.js 1.06 kB {0} [built]
[8] ./~/react-dom/lib/ReactInstrumentation.js 601 bytes {0} [built]
[10] ./~/react-dom/lib/ReactUpdates.js 9.53 kB {0} [built]
[18] ./~/react/lib/React.js 5.08 kB {0} [built]
[82] ./src/Edfa3ly/BusinessBundle/Resources/public/js/Edfa3lyReactApp/products.js 641 bytes {0} [built]
[83] ./src/Edfa3ly/BusinessBundle/Resources/public/js/Edfa3lyReactApp/main.js 25 bytes {0} [built]
[102] ./~/react-dom/index.js 59 bytes {0} [built]
[116] ./~/react-dom/lib/ReactDOM.js 5.17 kB {0} [built]
[165] ./~/react-dom/lib/findDOMNode.js 2.46 kB {0} [built]
[172] ./~/react-dom/lib/renderSubtreeIntoContainer.js 422 bytes {0} [built]
[175] ./~/react/lib/ReactChildren.js 6.19 kB {0} [built]
[176] ./~/react/lib/ReactDOMFactories.js 5.48 kB {0} [built]
[178] ./~/react/lib/ReactPropTypes.js 500 bytes {0} [built]
[180] ./~/react/lib/ReactVersion.js 350 bytes {0} [built]
[186] ./~/react/react.js 56 bytes {0} [built]
+ 172 hidden modules
Notes
Now the file main-e496dac1f5b908fe1cfc0ea9a07813ac984aee6c.8462e0b2df4475db7479.js is produced and was added to /compiled directory.
but the file that was produced when I run maba:webpack:compile which is main-e496dac1f5b908fe1cfc0ea9a07813ac984aee6c.bundle.js was not produced when I only ran maba:webpack:compile --env=prod
so is there is something else broken here or is this the normal behavior for production enviroment?
On line 9851 in main-e496dac1f5b908fe1cfc0ea9a07813ac984aee6c.8462e0b2df4475db7479.js
Here is what I found (basically a react component that I wrote)
class Welcome extends __WEBPACK_IMPORTED_MODULE_0_react___default.a.Component {
render() {
return __WEBPACK_IMPORTED_MODULE_0_react___default.a.createElement(
'h1',
null,
'Hello, REACT JS'
);
}
}
Here are the contents of package.json in case you needed to look at it
{
"name": "XXXX",
"description": "Hey",
"version": "1.2.3",
"private": true,
"dependencies": {
"async": "0.9.0",
"babel-preset-react": "^6.24.1",
"body-parser": "1.2.2",
"express": "4.5.0",
"forever": "latest",
"intravenous": "latest",
"mongodb": "1.4.5",
"mongojs": "0.13.0",
"react": "~15.6.1",
"react-dom": "~15.6.1",
"redis": "latest",
"socket.io": "0.9.17",
"underscore": "1.6.0"
},
"devDependencies": {
"grunt": "^0.4.5",
"grunt-apidoc": "~0.10.1",
"assets-webpack-plugin": "^3.5.1",
"autoprefixer": "^6.7.6",
"babel-core": "^6.23.1",
"babel-loader": "^6.4.0",
"babel-preset-env": "^1.2.1",
"css-loader": "^0.26.4",
"extract-file-loader": "^0.1.0",
"extract-text-webpack-plugin": "^2.1.0",
"file-loader": "^0.10.1",
"image-webpack-loader": "^3.2.0",
"less": "^2.7.2",
"less-loader": "^4.0.0",
"node-sass": "^4.5.0",
"postcss-loader": "^1.3.3",
"raw-loader": "^0.5.1",
"sass-loader": "^6.0.3",
"style-loader": "^0.13.2",
"webpack": "^2.2.1",
"webpack-dashboard": "^0.3.0",
"webpack-dev-server": "^2.4.1"
}
}
Also I previously made a modification to babel presets in wepack.config.js to get it to work properly with react since I'm primarily using the bundle for the react part of the project. Here is what I did:
config.module = {
rules: [
/**
* Compiles ES6 and ES7 into ES5 code
* Reference: https://github.com/babel/babel-loader
*/
{
test: /\.jsx?$/i,
loader: 'babel-loader',
exclude: /node_modules/,
options: {
presets:['react']
}
},
If this is the reason of issue, is it possible that I send this as a configuration to the bundle instead of directly modifying the webpack.config.js ? Would it help that way?