Ionic build browser --prod fails and does not copy/create javascript file in assets

Ionic Framework ionic-v3
1

I have a web worker in src/assets when I use ionic serve or ionic cordova run [Platform] I can see the app without problems but if I build the app using the --prod flag I get an ENOENT error and the build fails

    [15:53:09]  build prod started ...
    [15:53:09]  clean started ...
    [15:53:09]  clean finished in less than 1 ms
    [15:53:09]  copy started ...
    [15:53:09]  ngc started ...
    [15:53:22]  ngc finished in 13.86 s
    [15:53:22]  preprocess started ...
    [15:53:22]  deeplinks started ...
    [15:53:24]  deeplinks finished in 1.10 s
    [15:53:24]  optimization started ...
    [15:53:24]  copy finished in 15.62 s
    [15:53:48]  optimization finished in 24.85 s
    [15:53:48]  preprocess finished in 25.94 s
    [15:53:48]  webpack started ...
    [15:54:52]  webpack finished in 63.68 s
    [15:54:52]  sass started ...
    [15:54:52]  uglifyjs started ...
    (node:29259) UnhandledPromiseRejectionWarning: Unhandled promise rejection (rejection id: 1): 
    Error: ENOENT: no such file or directory, open '/Users/me/Documents/Projekte/apps/ionic3.myApp/www/build/a389ed33aa2794575fa2.worker.js'
    Error: ENOENT: no such file or directory, open '/Users/me/Documents/Projekte/apps/ionic3.myApp/www/build/a389ed33aa2794575fa2.worker.js' in undefined at line undefined, col undefined, pos undefined
    Segmentation fault: 11

If I build without the --prod flag I can see that file.

This happens for all the platforms. I can not find the reason of this. Does anybody knows what can be happening?

Ionic info

    @ionic/cli-utils  : 1.9.2
    ionic (Ionic CLI) : 3.9.2

global packages:

    Cordova CLI : 7.0.1

local packages:

    @ionic/app-scripts : 2.0.2
    Cordova Platforms  : android 6.2.3 browser 4.1.0 ios 4.4.0
    Ionic Framework    : ionic-angular 3.5.3

System:

    Android SDK Tools : 26.0.2
    ios-deploy        : 1.9.0
    ios-sim           : 5.0.8
    Node              : v6.10.3
    npm               : 3.10.10
    OS                : macOS Sierra
    Xcode             : Xcode 8.3.3 Build version 8E3004b

package.json


{
    "name": "myApp",
    "version": "0.0.1",
    "author": "distante",
    "private": true,
    "scripts": {
        "clean": "ionic-app-scripts clean",
        "build": "ionic-app-scripts build",
        "lint": "ionic-app-scripts lint",
        "ionic:build": "ionic-app-scripts build",
        "ionic:serve": "ionic-app-scripts serve"
    },
    "dependencies": {
        "@angular/common": "4.1.3",
        "@angular/compiler": "4.1.3",
        "@angular/compiler-cli": "4.1.3",
        "@angular/core": "4.1.3",
        "@angular/forms": "4.1.3",
        "@angular/http": "4.1.3",
        "@angular/platform-browser": "4.1.3",
        "@angular/platform-browser-dynamic": "4.1.3",
        "@ionic-native/core": "3.12.1",
        "@ionic-native/device": "^4.1.0",
        "@ionic-native/file": "^4.1.0",
        "@ionic-native/file-opener": "^4.1.0",
        "@ionic-native/file-transfer": "^4.1.0",
        "@ionic-native/keyboard": "^4.1.0",
        "@ionic-native/native-page-transitions": "^4.1.0",
        "@ionic-native/screen-orientation": "^4.1.0",
        "@ionic-native/splash-screen": "3.12.1",
        "@ionic-native/status-bar": "3.12.1",
        "@ionic/storage": "^2.0.1",
        "@types/crypto-js": "^3.1.33",
        "@types/pdf": "0.0.31",
        "com.telerik.plugins.nativepagetransitions": "^0.6.5",
        "cordova-android": "^6.2.3",
        "cordova-browser": "^4.1.0",
        "cordova-ios": "^4.4.0",
        "cordova-plugin-compat": "^1.1.0",
        "cordova-plugin-console": "^1.0.7",
        "cordova-plugin-device": "^1.1.6",
        "cordova-plugin-file": "^4.3.3",
        "cordova-plugin-file-opener2": "^2.0.19",
        "cordova-plugin-file-transfer": "^1.6.3",
        "cordova-plugin-screen-orientation": "^2.0.1",
        "cordova-plugin-splashscreen": "^4.0.3",
        "cordova-plugin-statusbar": "^2.2.3",
        "cordova-plugin-whitelist": "^1.3.2",
        "cordova-sqlite-storage": "^2.0.4",
        "crypto-js": "^3.1.9-1",
        "es6-promise-plugin": "git+https://github.com/vstirbu/PromisesPlugin.git",
        "ionic-angular": "^3.6.0",
        "ionic-plugin-keyboard": "^2.2.1",
        "ionicons": "3.0.0",
        "pdfjs-dist": "^1.8.618",
        "rxjs": "5.4.2",
        "sw-toolbox": "3.6.0",
        "zone.js": "0.8.12"
    },
    "devDependencies": {
        "@ionic/app-scripts": "^2.1.4",
        "ionic": "3.9.2",
        "typescript": "2.5.0"
    },
    "description": "Ionic Project",
    "cordova": {
        "plugins": {
            "cordova-sqlite-storage": {},
            "cordova-plugin-console": {},
            "cordova-plugin-device": {},
            "cordova-plugin-splashscreen": {},
            "cordova-plugin-statusbar": {},
            "cordova-plugin-whitelist": {},
            "ionic-plugin-keyboard": {},
            "cordova-plugin-file": {},
            "cordova-plugin-file-transfer": {},
            "com.telerik.plugins.nativepagetransitions": {},
            "cordova-plugin-file-opener2": {},
            "cordova-plugin-screen-orientation": {}
        },
        "platforms": [
            "android",
            "browser",
            "ios"
        ]
    }
}

Edit: npm run build --prod --verbose

npm info it worked if it ends with ok
npm verb cli [ '/usr/local/bin/node',
npm verb cli   '/usr/local/bin/npm',
npm verb cli   'run',
npm verb cli   'build',
npm verb cli   '--prod',
npm verb cli   '--verbose' ]
npm info using npm@3.10.10
npm info using node@v6.10.3
npm verb run-script [ 'prebuild', 'build', 'postbuild' ]
npm info lifecycle ionic3.myApp@0.0.1~prebuild: ionic3.myApp@0.0.1
npm info lifecycle ionic3.myApp@0.0.1~build: ionic3.myApp@0.0.1

> ionic3.myApp@0.0.1 build /Users/me/Documents/Projekte/apps/ionic3.myApp
> ionic-app-scripts build

[09:26:51]  ionic-app-scripts 2.1.4
[09:26:51]  build prod started ...
[09:26:51]  clean started ...
[09:26:51]  clean finished in 11 ms
[09:26:51]  copy started ...
[09:26:51]  ngc started ...
[09:27:03]  ngc finished in 12.17 s
[09:27:03]  preprocess started ...
[09:27:03]  deeplinks started ...
[09:27:04]  deeplinks finished in 1.01 s
[09:27:04]  optimization started ...
[09:27:05]  copy finished in 14.04 s
[09:27:22]  optimization finished in 18.31 s
[09:27:22]  preprocess finished in 19.32 s
[09:27:22]  webpack started ...
[09:28:10]  webpack finished in 47.81 s
[09:28:10]  sass started ...
[09:28:10]  uglifyjs started ...
(node:3119) UnhandledPromiseRejectionWarning: Unhandled promise rejection (rejection id: 1): Error: ENOENT: no such file or directory, open '/Users/me/Documents/Projekte/apps/ionic3.myApp/www/build/cac1802e234edd494891.worker.js'
[09:28:11]  ionic-app-script task: "build"
[09:28:11]  Error: ENOENT: no such file or directory, open
            '/Users/me/Documents/Projekte/apps/ionic3.myApp/www/build/cac1802e234edd494891.worker.js' in
            undefined at line undefined, col undefined, pos undefined
Error: ENOENT: no such file or directory, open '/Users/me/Documents/Projekte/apps/ionic3.myApp/www/build/cac1802e234edd494891.worker.js' in undefined at line undefined, col undefined, pos undefined
    at BuildError.Error (native)
    at new BuildError (/Users/me/Documents/Projekte/apps/ionic3.myApp/node_modules/@ionic/app-scripts/dist/util/errors.js:16:28)
    at taskReject (/Users/me/Documents/Projekte/apps/ionic3.myApp/node_modules/@ionic/app-scripts/dist/worker-process.js:36:22)
    at /Users/me/Documents/Projekte/apps/ionic3.myApp/node_modules/@ionic/app-scripts/dist/worker-process.js:14:13

npm verb lifecycle ionic3.myApp@0.0.1~build: unsafe-perm in lifecycle true
npm verb lifecycle ionic3.myApp@0.0.1~build: PATH: /usr/local/lib/node_modules/npm/bin/node-gyp-bin:/Users/me/Documents/Projekte/apps/ionic3.myApp/node_modules/.bin:/opt/local/bin:/opt/local/sbin:~/bin:~/bin/dotfiles/composer:/usr/local/bin:/usr/bin:/bin:/usr/sbin:/sbin:/opt/X11/bin:/opt/local/bin:/opt/local/sbin:~/bin:~/bin/dotfiles/composer:/Users/me/Library/Android/sdk/tools:/Users/me/Library/Android/sdk/platform-tools:/Users/me/Library/Android/sdk/tools:/Users/me/Library/Android/sdk/platform-tools
npm verb lifecycle ionic3.myApp@0.0.1~build: CWD: /Users/me/Documents/Projekte/apps/ionic3.myApp
npm info lifecycle ionic3.myApp@0.0.1~build: Failed to exec build script
npm verb stack Error: ionic3.myApp@0.0.1 build: `ionic-app-scripts build`
npm verb stack Exit status 1
npm verb stack     at EventEmitter.<anonymous> (/usr/local/lib/node_modules/npm/lib/utils/lifecycle.js:255:16)
npm verb stack     at emitTwo (events.js:106:13)
npm verb stack     at EventEmitter.emit (events.js:191:7)
npm verb stack     at ChildProcess.<anonymous> (/usr/local/lib/node_modules/npm/lib/utils/spawn.js:40:14)
npm verb stack     at emitTwo (events.js:106:13)
npm verb stack     at ChildProcess.emit (events.js:191:7)
npm verb stack     at maybeClose (internal/child_process.js:886:16)
npm verb stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:226:5)
npm verb pkgid ionic3.myApp@0.0.1
npm verb cwd /Users/me/Documents/Projekte/apps/ionic3.myApp
npm ERR! Darwin 16.7.0
npm ERR! argv "/usr/local/bin/node" "/usr/local/bin/npm" "run" "build" "--prod" "--verbose"
npm ERR! node v6.10.3
npm ERR! npm  v3.10.10
npm ERR! code ELIFECYCLE
npm ERR! ionic3.myApp@0.0.1 build: `ionic-app-scripts build`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the ionic3.myApp@0.0.1 build script 'ionic-app-scripts build'.
npm ERR! Make sure you have the latest version of node.js and npm installed.
npm ERR! If you do, this is most likely a problem with the ionic3.myApp package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     ionic-app-scripts build
npm ERR! You can get information on how to open an issue for this project with:
npm ERR!     npm bugs ionic3.myApp
npm ERR! Or if that isn't available, you can get their info via:
npm ERR!     npm owner ls ionic3.myApp
npm ERR! There is likely additional logging output above.
npm verb exit [ 1, true ]

npm ERR! Please include the following file with any support request:
npm ERR!     /Users/me/Documents/Projekte/apps/ionic3.myApp/npm-debug.log

npm-debug.log

0 info it worked if it ends with ok
1 verbose cli [ '/usr/local/bin/node',
1 verbose cli   '/usr/local/bin/npm',
1 verbose cli   'run',
1 verbose cli   'build',
1 verbose cli   '--prod',
1 verbose cli   '--verbose' ]
2 info using npm@3.10.10
3 info using node@v6.10.3
4 verbose run-script [ 'prebuild', 'build', 'postbuild' ]
5 info lifecycle ionic3.myApp@0.0.1~prebuild: ionic3.myApp@0.0.1
6 silly lifecycle ionic3.myApp@0.0.1~prebuild: no script for prebuild, continuing
7 info lifecycle ionic3.myApp@0.0.1~build: ionic3.myApp@0.0.1
8 verbose lifecycle ionic3.myApp@0.0.1~build: unsafe-perm in lifecycle true
9 verbose lifecycle ionic3.myApp@0.0.1~build: PATH: /usr/local/lib/node_modules/npm/bin/node-gyp-bin:/Users/me/Documents/Projekte/apps/ionic3.myApp/node_modules/.bin:/opt/local/bin:/opt/local/sbin:~/bin:~/bin/dotfiles/composer:/usr/local/bin:/usr/bin:/bin:/usr/sbin:/sbin:/opt/X11/bin:/opt/local/bin:/opt/local/sbin:~/bin:~/bin/dotfiles/composer:/Users/me/Library/Android/sdk/tools:/Users/me/Library/Android/sdk/platform-tools:/Users/me/Library/Android/sdk/tools:/Users/me/Library/Android/sdk/platform-tools
10 verbose lifecycle ionic3.myApp@0.0.1~build: CWD: /Users/me/Documents/Projekte/apps/ionic3.myApp
11 silly lifecycle ionic3.myApp@0.0.1~build: Args: [ '-c', 'ionic-app-scripts build' ]
12 silly lifecycle ionic3.myApp@0.0.1~build: Returned: code: 1  signal: null
13 info lifecycle ionic3.myApp@0.0.1~build: Failed to exec build script
14 verbose stack Error: ionic3.myApp@0.0.1 build: `ionic-app-scripts build`
14 verbose stack Exit status 1
14 verbose stack     at EventEmitter.<anonymous> (/usr/local/lib/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> (/usr/local/lib/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:886:16)
14 verbose stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:226:5)
15 verbose pkgid ionic3.myApp@0.0.1
16 verbose cwd /Users/me/Documents/Projekte/apps/ionic3.myApp
17 error Darwin 16.7.0
18 error argv "/usr/local/bin/node" "/usr/local/bin/npm" "run" "build" "--prod" "--verbose"
19 error node v6.10.3
20 error npm  v3.10.10
21 error code ELIFECYCLE
22 error ionic3.myApp@0.0.1 build: `ionic-app-scripts build`
22 error Exit status 1
23 error Failed at the ionic3.myApp@0.0.1 build script 'ionic-app-scripts build'.
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 ionic3.myApp package,
23 error not with npm itself.
23 error Tell the author that this fails on your system:
23 error     ionic-app-scripts build
23 error You can get information on how to open an issue for this project with:
23 error     npm bugs ionic3.myApp
23 error Or if that isn't available, you can get their info via:
23 error     npm owner ls ionic3.myApp
23 error There is likely additional logging output above.
24 verbose exit [ 1, true ]
2

This is old, you should upgrade.

What is the filename of your file in src/assets? Should webpack do anything with it at all?

3

Could this break something?

I have testet changing the name between my-webworker.js, distante_webworker.js without success.

I suppose webpack just need to copy it to the assets folder. I have a service that loads the web worker using myWorker = new Worker('assets/my-webworker.js');

Thanks for your help.

4

Changing things can always break stuff, but this should be pretty safe. And you can just revert the changes in git if it does.

5

Ok, I have updated ionic/app-scripts also ionic-angular to 3.6.0, deleted node_modules and reinstalled all. Nothing broke but the error still happens (just with a different random letters name before the worker.js.

I am not sure how to track it since there is no verbose flag defined in the build script.

I do have a suspect. when I run node list I get (besides de cordova extraneous plugins) this error:

npm ERR! peer dep missing: webpack@>=0.9 <2 || ^2.1.0-beta || ^2.2.0, required by worker-loader@0.8.1

That package is needed for pdfjs-dist. Could it be that it does not work with Webpack 3.5.6 required for @ionic/app-scripts?

edit: I have added the package.json and the npm build --prod verbose output

6

Ok, I am out of ideas. I don’t know nearly enough about app-scripts and webpack to help here any further. I suggest you also create an issue at GitHub - ionic-team/ionic-app-scripts: App Build Scripts for Ionic Projects - maybe someone there can help.

7

Looks like the problem does not come directly from ionic-app-scripts , or well I do not think so.

I have tested one package at the time. And the problem happens when I install pdf-dist and try to import and use the webpack version of it.

I have added "webpack": "^2.2.0" to my package.json and UNMEET is gone but it still hat the same problem.

Since the problem is Happening with uglifyjs I look it up and found this https://github.com/mozilla/pdf.js/issues/7326. It is not the same problem but could be related.

I also saw that my project has 2 versions of uglifyjs:

├─┬ @ionic/app-scripts@2.1.4
│ ├── uglify-js@3.0.28
│ └─┬ webpack@3.5.6
│   └─┬ uglifyjs-webpack-plugin@0.4.6
│     └── uglify-js@2.8.29
└─┬ webpack@2.7.0
  └── uglify-js@2.8.29
8

Correct, app-scripts it the thing you trigger by --prod to configure its usage of webpack in a different way which causes things to happen to your file I would guess.