webpack build errors

[itdpong]

when I using 'npm run build', webpack returns the following error, would someone gie me some hints to solve it???

`ERROR in static/js/vendor.06660da322d4391a4255.js from UglifyJs Unexpected token: name (Camera) [./node_modules/instascan/src/camera.js:6,0][static/js/vendor.06660da322d4391a4255.js:63577,6]

Build failed with errors. `

the following is the log file 0 info it worked if it ends with ok 1 verbose cli [ 'C:\Program Files\nodejs\node.exe', 1 verbose cli 'C:\Users\peter\AppData\Roaming\npm\node_modules\npm\bin\npm-cli.js', 1 verbose cli 'run', 1 verbose cli 'build' ] 2 info using npm@5.4.2 3 info using node@v8.4.0 4 verbose run-script [ 'prebuild', 'build', 'postbuild' ] 5 info lifecycle apps@1.0.0~prebuild: apps@1.0.0 6 info lifecycle apps@1.0.0~build: apps@1.0.0 7 verbose lifecycle apps@1.0.0~build: unsafe-perm in lifecycle true 9 verbose lifecycle apps@1.0.0~build: CWD: C:\vue\apps 10 silly lifecycle apps@1.0.0~build: Args: [ '/d /s /c', 'node build/build.js' ] 11 silly lifecycle apps@1.0.0~build: Returned: code: 1 signal: null 12 info lifecycle apps@1.0.0~build: Failed to exec build script 13 verbose stack Error: apps@1.0.0 build: node build/build.js 13 verbose stack Exit status 1 13 verbose stack at EventEmitter. (C:\Users\peter\AppData\Roaming\npm\node_modules\npm\node_modules\npm-lifecycle\index.js:280:16) 13 verbose stack at emitTwo (events.js:125:13) 13 verbose stack at EventEmitter.emit (events.js:213:7) 13 verbose stack at ChildProcess. (C:\Users\peter\AppData\Roaming\npm\node_modules\npm\node_modules\npm-lifecycle\lib\spawn.js:55:14) 13 verbose stack at emitTwo (events.js:125:13) 13 verbose stack at ChildProcess.emit (events.js:213:7) 13 verbose stack at maybeClose (internal/child_process.js:927:16) 13 verbose stack at Process.ChildProcess._handle.onexit (internal/child_process.js:211:5) 14 verbose pkgid apps@1.0.0 15 verbose cwd C:\vue\apps 16 verbose Windows_NT 6.1.7601 17 verbose argv "C:\Program Files\nodejs\node.exe" "C:\Users\peter\AppData\Roaming\npm\node_modules\npm\bin\npm-cli.js" "run" "build" 18 verbose node v8.4.0 19 verbose npm v5.4.2 20 error code ELIFECYCLE 21 error errno 1 22 error apps@1.0.0 build: node build/build.js 22 error Exit status 1 23 error Failed at the apps@1.0.0 build script. 23 error This is probably not a problem with npm. There is likely additional logging output above. 24 verbose exit [ 1, true ]

[Shuliyey]

+1

[sk1p]

The problem is UglifyJS not expecting ES6 as its input (as I understood). I solved this by letting babel-loader process the instascan files, using the following in my webpack config:

    const path = require('path');
    // [...]
    rules: [
        {
            test: /\.js$/,
            include: [
                path.resolve(__dirname, "yourapp"),
                path.resolve(__dirname, "node_modules", "instascan", "src", "scanner.js"),
                path.resolve(__dirname, "node_modules", "instascan", "src", "camera.js"),
            ],
            use: 'babel-loader',
        }
    ],
    // [...]

[Shuliyey]

thank you so much @sk1p , this all make sense, and helpe in understanding webpack/babel-loader.

This will use babel-loader to process the included files (the specified list) first (hence it turns any ES syntax, whether it's 5,6,7...) into basic supported javascript syntax, this way uglify js won't run into problems (as final artifacts to uglify is already the basic supported javascript syntax)

[Shuliyey]

interesting @sk1p, now i get this error

Uncaught TypeError: Cannot assign to read only property 'exports' of object '#<Object>'
    at Object.eval (scanner.js?f767:373)
    at eval (326:564)
    at Object.<anonymous> (app.js:2837)
    at __webpack_require__ (app.js:689)
    at fn (app.js:110)
    at eval (index.js?9777:5)
    at Object.<anonymous> (app.js:5115)
    at __webpack_require__ (app.js:689)
    at fn (app.js:110)
    at eval (webpack-internal:///338:2)

This is when running the application, so build all passed, but when actually running, this error is thrown

[Shuliyey]

ok i found the work around to the last issue, when getting packaged by webpack

Uncaught TypeError: Cannot assign to read only property 'exports' of object '#<Object>'

https://github.com/webpack/webpack/issues/4039#issuecomment-283501082