ERROR in bundle.js from UglifyJs Unexpected token: punc (}) [bundle.js:3358,0]

[ghost]

Hi,

I am getting the following error when running the

$ npm start
ERROR in bundle.js from UglifyJs
Unexpected token: punc (}) [bundle.js:3358,0]

Both $ npm install and
$ npm run postinstall worked perfectly.

Any help greatly appreciated. Am new to React and have fallen at the first hurdle.

Regards

Sally

[danielstern]

Hello. Try cloning the finished repo and working backwards from there. Cheers

…

________________________________ From: sally7682 <notifications@github.com> Sent: May 30, 2019 4:17 PM To: danielstern/isomorphic-react Cc: Subscribed Subject: [danielstern/isomorphic-react] ERROR in bundle.js from UglifyJs Unexpected token: punc (}) [bundle.js:3358,0] (#17) Hi, I am getting the following error when running the $ npm start ERROR in bundle.js from UglifyJs Unexpected token: punc (}) [bundle.js:3358,0] Both $ npm install and $ npm run postinstall worked perfectly. Any help greatly appreciated. Am new to React and have fallen at the first hurdle. Regards Sally — You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub<#17?email_source=notifications&email_token=ABASA6C6CBAUBPUT5HBT7SLPYAY47A5CNFSM4HRKP67KYY3PNVWWK3TUL52HS4DFUVEXG43VMWVGG33NNVSW45C7NFSM4GWZ4PPA>, or mute the thread<https://github.com/notifications/unsubscribe-auth/ABASA6GZM7VU5AX4XUVCQXDPYAY47ANCNFSM4HRKP67A>.

[conorriches]

Same issue here. Here are my steps to replicate:

• Clone new repo from master
• run npm install && npm run postinstall
• run npm start

System: Mac OS
Node version: 8.9.1

Log:

    Asset    Size  Chunks                    Chunk Names
bundle.js  811 kB       0  [emitted]  [big]  main
   [5] (webpack)/buildin/global.js 509 bytes {0} [built]
  [75] multi babel-regenerator-runtime ./src 40 bytes {0} [built]
  [78] ./src/index.jsx 2.85 kB {0} [built]
  [79] ./src/App.jsx 1.82 kB {0} [built]
 [101] (webpack)/buildin/harmony-module.js 596 bytes {0} [built]
 [153] ./src/getStore.js 2.68 kB {0} [built]
 [161] ./src/sagas/fetch-question-saga.js 653 bytes {0} [built]
 [163] ./src/sagas/fetch-questions-saga.js 647 bytes {0} [built]
 [164] ./src/reducers/index.js 198 bytes {0} [built]
 [165] ./src/reducers/questions.js 906 bytes {0} [built]
    + 222 hidden modules

ERROR in bundle.js from UglifyJs
Unexpected token: punc (}) [bundle.js:3358,0]
npm ERR! code ELIFECYCLE
npm ERR! errno 2
npm ERR! isomorphic-react@1.0.0 build: `cross-env webpack --config ./webpack.config.prod.babel.js`
npm ERR! Exit status 2
npm ERR!
npm ERR! Failed at the isomorphic-react@1.0.0 build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

I've cleared node_modules and done a fresh install and can still replicate.

[ghost]

Hi Conor,

Yes my problem exactly. I am running on windows 10. I also went through the same steps as you. Having hunted arround a little online I did find some info indicating that there is a compatability issue with ES6 and UglyfyJS.
More info here on stack overflow
https://stackoverflow.com/questions/41254538/error-in-bundle-js-from-uglifyjs

I have tried a couple of the suggestions on this post and none seem to work including adding
"uglify-js": "git+https://github.com/mishoo/UglifyJS2.git#harmony"
to my package.json

Please do let me know if you find the solution. I will pass it on as well of I get to the bottom of this.

Kind regards

Sally

---

Hash: a712d1edd7c25c19e2e8
Version: webpack 3.12.0
Time: 2298ms
Asset Size Chunks Chunk Names
bundle.js 811 kB 0 [emitted] [big] main
[5] (webpack)/buildin/global.js 509 bytes {0} [built]
[75] multi babel-regenerator-runtime ./src 40 bytes {0} [built]
[78] ./src/index.jsx 2.88 kB {0} [built]
[79] ./src/App.jsx 1.83 kB {0} [built]
[101] (webpack)/buildin/harmony-module.js 596 bytes {0} [built]
[153] ./src/getStore.js 2.7 kB {0} [built]
[161] ./src/sagas/fetch-question-saga.js 659 bytes {0} [built]
[163] ./src/sagas/fetch-questions-saga.js 653 bytes {0} [built]
[164] ./src/reducers/index.js 201 bytes {0} [built]
[165] ./src/reducers/questions.js 918 bytes {0} [built]
+ 222 hidden modules

ERROR in bundle.js from UglifyJs
Unexpected token: punc (}) [bundle.js:3358,0]
npm ERR! code ELIFECYCLE
npm ERR! errno 2
npm ERR! isomorphic-react@1.0.0 build: cross-env webpack --config ./webpack.config.prod.babel.js
npm ERR! Exit status 2
npm ERR!
npm ERR! Failed at the isomorphic-react@1.0.0 build 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! C:\Users\Sal\AppData\Roaming\npm-cache_logs\2019-06-03T19_05_42_614Z-debug.log
npm ERR! code ELIFECYCLE
npm ERR! errno 2
npm ERR! isomorphic-react@1.0.0 start-prod: npm run build && cross-env NODE_ENV=production babel-node server --useServerRender=true --useLiveData=false
npm ERR! Exit status 2
npm ERR!
npm ERR! Failed at the isomorphic-react@1.0.0 start-prod 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! C:\Users\Sal\AppData\Roaming\npm-cache_logs\2019-06-03T19_05_42_737Z-debug.log
npm ERR! code ELIFECYCLE
npm ERR! errno 2
npm ERR! isomorphic-react@1.0.0 start: npm run start-prod
npm ERR! Exit status 2
npm ERR!
npm ERR! Failed at the isomorphic-react@1.0.0 start 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! C:\Users\Sal\AppData\Roaming\npm-cache_logs\2019-06-03T19_05_42_816Z-debug.log

[petecuttriss]

Hi all,

I'm getting the same issue after doing a fresh clone and then running "npm start". This in turn runs "npm run start-prod".

I have found that if I run "npm run start-dev" it works correctly, and I'm then able to browse the application on localhost:3000.

Looks like it's the call to new webpack.optimize.UglifyJsPlugin() in the webpack.config.prod.babel.js file causes it. I've found that commenting this out stops the error but I guess will no longer Uglify the output for a production build.

Hopefully this helps to further diagnose the problem. Note, I'm using npm v6.9.0 and node v10.16.0 on Windows 10.

Regards
Pete

[ghost]

Pete,

Thanks for taking the time to respond.
I will definitely try this even as you say if my output is no longer Uglifyed!
Anything that moves me forward is helpful.
:-)
Sally

[petecuttriss]

Hi Sally, no problem.

I did manage to incorporate Uglification (is that a word?)... I ended up installing the uglifyjs-webpack-plugin (npm install --save-dev uglifyjs-webpack-plugin@v1.3.0). I then updated the production webpack config (webpack.config.prod.babel.js) to use this different plugin: new UglifyJSPlugion(). My config is shown below.

Give this a try if you want and hopefully it helps.

Pete

const path = require('path');
const webpack = require('webpack');
const UglifyJSPlugin = require('uglifyjs-webpack-plugin');

/**
 * Production Webpack Config bundles JS, then uglifies it and exports it to the "dist" directory
 * See Development webpack config for detailed comments
 */
module.exports = {
    entry: [
        'babel-regenerator-runtime',
        path.resolve(__dirname, 'src')
    ],
    output: {
        path: path.resolve(__dirname, 'dist'),
        filename: 'bundle.js',
        publicPath: '/'
    },
    plugins: [
        new webpack.DefinePlugin({
            'process.env': {
                NODE_ENV: JSON.stringify('production'),
                WEBPACK: true
            }
        }),
        /**
         * Uglifies JS which improves performance
         * React will throw console warnings if this is not implemented
         */
        //new webpack.optimize.UglifyJsPlugin()
        new UglifyJSPlugin()
    ],
    resolve: {
        extensions: ['.js', '.json', '.jsx'],
    },
    module: {
        loaders: [
            {
                test: /\.jsx?$/,
                use: {
                    loader: 'babel-loader'
                },
                include: path.resolve(__dirname, 'src')
            }
        ]
    }
};

[GaddMaster]

This is the new big dog now !

https://github.com/webpack-contrib/terser-webpack-plugin