search

webpack / webpack-pwa

Example for a super simple PWA with webpack.
https://webpack.github.io/webpack-pwa/page-shell/dashboard.html
810 stars 52 forks source link

error running npm run build-shell in windows 10 #10

Open Sensiblemnd opened 7 years ago

Sensiblemnd commented 7 years ago

Got an error running npm run-build shell in windows 10

C:\Projects\webpack-pwa-master>npm run build-shell

webpack-pwa@1.0.0 build-shell C:\Projects\webpack-pwa-master webpack -p --env.appShell

Hash: ce341eb5b8f22385368c Version: webpack 2.2.1 Time: 1336ms Asset Size Chunks Chunk Names dashboard.html 202 bytes [emitted] 86a1c3085e135767dd99.js 298 bytes 0 [emitted] 2b1b28982bbce9a8fb90.js 1.43 kB 2 [emitted] f57ea59692eeddb5f9ff.js 352 kB 3 [emitted] [big] shell-5232f0bea5d8b88088f5.js 12 kB 4 [emitted] shell afe436fe358f24997858.js 2.86 kB 1 [emitted] login.html 202 bytes [emitted] admin.html 202 bytes [emitted] sw.js 7.83 kB [emitted] appcache/manifest.appcache 121 bytes [emitted] appcache/manifest.html 58 bytes [emitted] [0] ./app/loading/page.js 217 bytes {4} [built] [1] ./app/app.js 2.31 kB {4} [built] [2] ./app/error/page.js 224 bytes {0} [built] [3] ./app async ^.\/.*\/page$ 160 bytes {4} [built] [4] ./~/offline-plugin/runtime.js 1.63 kB {4} [built] [5] ./app/shell.js 115 bytes {4} [built] [6] ./app/admin/page.js 351 kB {3} [optional] [built] [7] ./app/dashboard/page.js 1.05 kB {1} [optional] [built] [8] ./app/login/page.js 415 bytes {2} [optional] [built] [9] ./app/utils/fetch.js 285 bytes {1} [built] [10] ./app/admin/page.html 190 bytes {3} [built] [11] ./app/dashboard/page.html 328 bytes {1} [built] [12] ./app/login/page.html 190 bytes {2} [built]

ERROR in afe436fe358f24997858.js from UglifyJs SyntaxError: Unexpected token: punc ()) [afe436fe358f24997858.js:27,65]

ERROR in 2b1b28982bbce9a8fb90.js from UglifyJs SyntaxError: Unexpected token: punc ()) [2b1b28982bbce9a8fb90.js:25,69]

ERROR in f57ea59692eeddb5f9ff.js from UglifyJs SyntaxError: Unexpected token: punc ()) [f57ea59692eeddb5f9ff.js:25,69]

ERROR in shell-5232f0bea5d8b88088f5.js from UglifyJs SyntaxError: Unexpected character '`' [shell-5232f0bea5d8b88088f5.js:153,42] Child __offline_serviceworker: [0] ./~/offline-plugin/empty-entry.js 0 bytes {0} [built] [1] ./~/offline-plugin/lib/misc/sw-loader.js?json=%7B%22data_var_name%22%3A%22__wpo%22%2C%22loaders%22%3A%5B%5D%2C%22cacheMaps%22%3A%5B%5D%7D!./~/offline-plugin/empty-entry.js 16.2 kB {0} [built] Child html-webpack-plugin for "dashboard.html": [0] ./~/lodash/lodash.js 540 kB {0} [built] [1] (webpack)/buildin/global.js 509 bytes {0} [built] [2] (webpack)/buildin/module.js 517 bytes {0} [built] [3] ./~/html-webpack-plugin/lib/loader.js!./~/html-webpack-plugin/default_index.ejs 538 bytes {0} [built] Child html-webpack-plugin for "login.html": [0] ./~/lodash/lodash.js 540 kB {0} [built] [1] (webpack)/buildin/global.js 509 bytes {0} [built] [2] (webpack)/buildin/module.js 517 bytes {0} [built] [3] ./~/html-webpack-plugin/lib/loader.js!./~/html-webpack-plugin/default_index.ejs 538 bytes {0} [built] Child html-webpack-plugin for "admin.html": [0] ./~/lodash/lodash.js 540 kB {0} [built] [1] (webpack)/buildin/global.js 509 bytes {0} [built] [2] (webpack)/buildin/module.js 517 bytes {0} [built] [3] ./~/html-webpack-plugin/lib/loader.js!./~/html-webpack-plugin/default_index.ejs 538 bytes {0} [built]

0 info it worked if it ends with ok 1 verbose cli [ 'C:\\Program Files\\nodejs\\node.exe', 1 verbose cli 'C:\\Program Files\\nodejs\\node_modules\\npm\\bin\\npm-cli.js', 1 verbose cli 'run', 1 verbose cli 'build-shell' ] 2 info using npm@3.10.10 3 info using node@v6.9.4 4 verbose run-script [ 'prebuild-shell', 'build-shell', 'postbuild-shell' ] 5 info lifecycle webpack-pwa@1.0.0~prebuild-shell: webpack-pwa@1.0.0 6 silly lifecycle webpack-pwa@1.0.0~prebuild-shell: no script for prebuild-shell, continuing 7 info lifecycle webpack-pwa@1.0.0~build-shell: webpack-pwa@1.0.0 8 verbose lifecycle webpack-pwa@1.0.0~build-shell: unsafe-perm in lifecycle true 9 verbose lifecycle webpack-pwa@1.0.0~build-shell: PATH: C:\Program Files\nodejs\node_modules\npm\bin\node-gyp-bin;C:\Projects\webpack-pwa-master\node_modules\.bin;C:\ProgramData\Oracle\Java\javapath;C:\windows\system32;C:\windows;C:\windows\System32\Wbem;C:\windows\System32\WindowsPowerShell\v1.0\;C:\windows\system32\config\systemprofile\.dnx\bin;C:\Program Files\Microsoft DNX\Dnvm\;C:\Program Files\Microsoft SQL Server\130\Tools\Binn\;C:\Program Files (x86)\Microsoft SQL Server\Client SDK\ODBC\130\Tools\Binn\;C:\Program Files (x86)\Microsoft SQL Server\130\Tools\Binn\;C:\Program Files (x86)\Microsoft SQL Server\130\DTS\Binn\;C:\Program Files (x86)\Microsoft SQL Server\130\Tools\Binn\ManagementStudio\;C:\Program Files\nodejs\;C:\Program Files\Git\cmd;C:\Users\rlloveras\AppData\Roaming\npm;C:\Program Files (x86)\Microsoft VS Code\bin 10 verbose lifecycle webpack-pwa@1.0.0~build-shell: CWD: C:\Projects\webpack-pwa-master 11 silly lifecycle webpack-pwa@1.0.0~build-shell: Args: [ '/d /s /c', 'webpack -p --env.appShell' ] 12 silly lifecycle webpack-pwa@1.0.0~build-shell: Returned: code: 2 signal: null 13 info lifecycle webpack-pwa@1.0.0~build-shell: Failed to exec build-shell script 14 verbose stack Error: webpack-pwa@1.0.0 build-shell:webpack -p --env.appShell 14 verbose stack Exit status 2 14 verbose stack at EventEmitter.<anonymous> (C:\Program Files\nodejs\node_modules\npm\lib\utils\lifecycle.js:255:16) 14 verbose stack at emitTwo (events.js:106:13) 14 verbose stack at EventEmitter.emit (events.js:191:7) 14 verbose stack at ChildProcess.<anonymous> (C:\Program Files\nodejs\node_modules\npm\lib\utils\spawn.js:40:14) 14 verbose stack at emitTwo (events.js:106:13) 14 verbose stack at ChildProcess.emit (events.js:191:7) 14 verbose stack at maybeClose (internal/child_process.js:877:16) 14 verbose stack at Process.ChildProcess._handle.onexit (internal/child_process.js:226:5) 15 verbose pkgid webpack-pwa@1.0.0 16 verbose cwd C:\Projects\webpack-pwa-master 17 error Windows_NT 10.0.10586 18 error argv "C:\\Program Files\\nodejs\\node.exe" "C:\\Program Files\\nodejs\\node_modules\\npm\\bin\\npm-cli.js" "run" "build-shell" 19 error node v6.9.4 20 error npm v3.10.10 21 error code ELIFECYCLE 22 error webpack-pwa@1.0.0 build-shell:webpack -p --env.appShell 22 error Exit status 2 23 error Failed at the webpack-pwa@1.0.0 build-shell script 'webpack -p --env.appShell'. 23 error Make sure you have the latest version of node.js and npm installed. 23 error If you do, this is most likely a problem with the webpack-pwa package, 23 error not with npm itself. 23 error Tell the author that this fails on your system: 23 error webpack -p --env.appShell 23 error You can get information on how to open an issue for this project with: 23 error npm bugs webpack-pwa 23 error Or if that isn't available, you can get their info via: 23 error npm owner ls webpack-pwa 23 error There is likely additional logging output above. 24 verbose exit [ 1, true ]

spnc-omz commented 7 years ago

I'm having a similar issue, MacOS. It seems to be an issue with UglifyJS

Check out the following issue on angular for some more information. https://github.com/angular/angular/issues/11555

TheLarkInn commented 7 years ago

See https://github.com/webpack/webpack/issues/4394#issuecomment-283097693

TheLarkInn commented 7 years ago

Looks like patch dep. update.

keblodev commented 7 years ago

fyi -> same issue. osx. Better freeze those versions

neewbee commented 6 years ago

still persists

tiptronic commented 5 years ago

still... the problem is: learning something new from something that doesn't work is a bit problematic... Can someone (who already knows what's going on):

z639 commented 5 years ago

Same for Linux, so likely nothing to do with the OS.

Here's how I got this to work, maybe it'll work for others...

run: npm outdated Then change package.json to all the latest versions and add webpack-cli, because it'll ask anyway:

{ "name": "webpack-pwa", "private": true, "version": "1.0.0", "description": "Example for a super simple PWA with webpack.", "scripts": { "start": "webpack-dev-server -d", "build-page": "webpack -p", "build-both": "webpack -p --env.output page-shell && webpack -p --env.appShell --env.output app-shell", "deploy": "rm -rf dist && webpack -p --env.output page-shell && webpack -p --env.appShell --env.output app-shell && gh-pages -d dist", "build-shell": "webpack -p --env.appShell" }, "author": "Tobias Koppers @sokra", "license": "MIT", "devDependencies": { "html-loader": "0.5.5", "html-webpack-plugin": "3.2.0", "offline-plugin": "5.0.6", "webpack": "4.26.0", "webpack-cli": "^3.1.2", "webpack-dev-server": "3.1.10" }, "dependencies": { "gh-pages": "2.0.1", "toposort": "2.0.2" } }

I'll save you some time, this will likely still have two errors...

https://github.com/marcelklehr/toposort/issues/20#issuecomment-333541919 (might as well use the latest version)

fixed by running: npm install toposort@2.0.2 or just adding it to the packages.json (as above)

https://github.com/jantimon/html-webpack-plugin/issues/870#issuecomment-370004105

fixed with a change to webpack.config file:

` const path = require("path"); const OfflinePlugin = require("offline-plugin"); const HtmlWebpackPlugin = require("html-webpack-plugin");

module.exports = ({ appShell, output = "." } = {}) => ({ entry: appShell ? { // App Shell has only a single entry point // this entry point loads pages with import() shell: "./app/shell.js" } : { // Page Shell requires an entry point per page dashboard: "./app/dashboard.js", login: "./app/login.js", admin: "./app/admin.js" }, output: { path: path.resolve(__dirname, "dist", output), filename: "[name]-[chunkhash].js", chunkFilename: "[chunkhash].js" }, module: { rules: [ { test: /.html/, use: "html-loader" } ] }, plugins: [ // Generate a HTML page per page // This could be replace by some server logic or SSR // For the Page Shell each HTML page need to reference the correct entry point new HtmlWebpackPlugin({ filename: "dashboard.html", chunksSortMode: 'none', chunks: !appShell && ["dashboard"] }), new HtmlWebpackPlugin({ filename: "login.html", chunksSortMode: 'none', chunks: !appShell && ["login"] }), new HtmlWebpackPlugin({ filename: "admin.html", chunksSortMode: 'none', chunks: !appShell && ["admin"] }), // Offline support new OfflinePlugin({ caches: { main: [ // These assets don't have a chunk hash. // SW fetch them on every SW update. "dashboard.html", "login.html", "admin.html" ], additional: [ // All other assets have a chunk hash. // SW only fetch them once. // They'll have another name on change. ":rest:" ] }, // To remove a warning about additional need to have hash safeToUseOptionalCaches: true, // "additional" section is fetch only once. updateStrategy: "changed" }) ] });

`

Now when I run the install/build instructions everything runs fine.