Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Ionic build --prod freezes after webpack started, copy finished... #1426

Open
Bengejd opened this Issue May 2, 2018 · 54 comments

Comments

Projects
None yet
@Bengejd
Copy link

Bengejd commented May 2, 2018

Short description of the problem:

When running ionic cordova build ios --prod the command starts running, but then (seemingly) stops after

21:14:41]  build prod started ... 
[21:14:41]  clean started ... 
[21:14:41]  clean finished in 2 ms 
[21:14:41]  copy started ... 
[21:14:41]  deeplinks started ... 
[21:14:41]  deeplinks finished in 311 ms 
[21:14:41]  ngc started ... 
[21:14:57]  ngc finished in 15.79 s 
[21:14:57]  preprocess started ... 
[21:14:57]  preprocess finished in less than 1 ms 
[21:14:57]  webpack started ... 
[21:14:57]  copy finished in 16.44 s 

What behavior are you expecting?

For the build process to continue, like it does when you run ionic cordova build ios

Steps to reproduce:

  1. Run the above mentioned command with the prod flag.

Package.Json

  "dependencies": {
    "@angular/animations": "5.2.10",
    "@angular/common": "5.2.10",
    "@angular/compiler": "5.2.10",
    "@angular/compiler-cli": "5.2.10",
    "@angular/core": "5.2.10",
    "@angular/forms": "5.2.10",
    "@angular/http": "5.2.10",
    "@angular/platform-browser": "5.2.10",
    "@angular/platform-browser-dynamic": "5.2.10",
    "@firebase/app": "^0.1.10",
    "@ionic-native/camera": "^4.7.0",
    "@ionic-native/camera-preview": "^4.7.0",
    "@ionic-native/core": "^4.7.0",
    "@ionic-native/diagnostic": "^4.7.0",
    "@ionic-native/geolocation": "^4.7.0",
    "@ionic-native/google-maps": "^4.7.0",
    "@ionic-native/onesignal": "^4.7.0",
    "@ionic-native/photo-library": "^4.7.0",
    "@ionic-native/splash-screen": "^4.7.0",
    "@ionic-native/status-bar": "^4.7.0",
    "@ionic/storage": "^2.1.3",
    "algoliasearch": "^3.26.0",
    "angular2-click-outside": "^0.1.0",
    "angularfire2": "^5.0.0-rc.6",
    "animate.css": "^3.6.1",
    "branch-cordova-sdk": "^2.6.24",
    "cordova-ios": "4.5.4",
    "cordova-plugin-add-swift-support": "^1.7.2",
    "cordova-plugin-camera": "^4.0.2",
    "cordova-plugin-camera-preview": "git+https://github.com/cordova-plugin-camera-preview/cordova-plugin-camera-preview.git",
    "cordova-plugin-device": "^2.0.1",
    "cordova-plugin-file": "^5.0.0",
    "cordova-plugin-geolocation": "^4.0.1",
    "cordova-plugin-googlemaps": "git+https://github.com/mapsplugin/cordova-plugin-googlemaps.git#multiple_maps",
    "cordova-plugin-ionic-webview": "^1.2.0",
    "cordova-plugin-keyboard": "^1.2.0",
    "cordova-plugin-mauron85-background-geolocation": "^2.3.5",
    "cordova-plugin-photo-library": "^2.1.1",
    "cordova-plugin-splashscreen": "^5.0.2",
    "cordova-plugin-statusbar": "^2.4.1",
    "cordova-plugin-whitelist": "^1.3.3",
    "cordova-sqlite-storage": "^2.3.0",
    "cordova.plugins.diagnostic": "^4.0.5",
    "css-animator": "^2.3.0",
    "date-fns": "^1.29.0",
    "firebase": "^4.13.1",
    "firebase-tools": "^3.18.4",
    "geofire": "^4.1.2",
    "geofirestore": "^1.0.1",
    "ionic-angular": "3.9.2",
    "ionicons": "3.0.0",
    "jimp": "^0.2.27",
    "lodash": "^4.17.5",
    "ng-click-outside": "^3.2.0",
    "ng2-rx-componentdestroyed": "^2.1.0",
    "npm": "^5.8.0",
    "onesignal-cordova-plugin": "^2.3.3",
    "rxjs": "^5.5.10",
    "sharp": "^0.20.1",
    "sw-toolbox": "3.6.0",
    "sweetalert": "^2.1.0",
    "zone.js": "^0.8.26"
  },
  "devDependencies": {
    "@ionic/app-scripts": "^3.1.9",
    "@types/lodash": "4.14.106",
    "typescript": "^2.6.2"
  },
  "description": "An Ionic project",
  "cordova": {
    "plugins": {
      "cordova-plugin-whitelist": {},
      "cordova-plugin-device": {},
      "cordova-plugin-splashscreen": {},
      "cordova-plugin-statusbar": {},
      "cordova-plugin-ionic-webview": {},
      "cordova-plugin-ionic-keyboard": {},
      "branch-cordova-sdk": {},
      "cordova.plugins.diagnostic": {},
      "cordova-plugin-camera": {
        "CAMERA_USAGE_DESCRIPTION": "To take photos",
        "PHOTOLIBRARY_USAGE_DESCRIPTION": "To select photos"
      },
      "cordova-sqlite-storage": {},
      "onesignal-cordova-plugin": {},
      "cordova-plugin-add-swift-support": {},
      "cordova-plugin-photo-library": {
        "PHOTO_LIBRARY_USAGE_DESCRIPTION": "To choose photos"
      },
      "cordova-plugin-keyboard": {},
      "cordova-plugin-camera-preview": {},
      "com.googlemaps.ios": {},
      "cordova-plugin-googlemaps": {
        "API_KEY_FOR_ANDROID": "AIzaSyCqDppTYeY_1kjBBCorBhkscqgJZ1F_lcg",
        "API_KEY_FOR_IOS": "AIzaSyCqDppTYeY_1kjBBCorBhkscqgJZ1F_lcg",
        "LOCATION_WHEN_IN_USE_DESCRIPTION": "To find people nearby",
        "LOCATION_ALWAYS_USAGE_DESCRIPTION": "To find people nearby"
      },
      "cordova-plugin-mauron85-background-geolocation": {
        "ALWAYS_USAGE_DESCRIPTION": "To update your location"
      },
      "cordova-plugin-geolocation": {
        "GEOLOCATION_USAGE_DESCRIPTION": "To find things nearby"
      }
    },
    "platforms": [
      "ios"
    ]
  }
}

Which @ionic/app-scripts version are you using?
3.1.9

Other information: (e.g. stacktraces, related issues, suggestions how to fix, stackoverflow links, forum links, etc)

This was seemingly fixed in the 3.1.9 update of @ionic/app-scripts. But I'm still running into this issue after upgrading from 3.1.8.

@ayaka209

This comment has been minimized.

Copy link

ayaka209 commented May 3, 2018

+1 here, tried to add max_old_space_size parameter, upgrade @ angular-devkit/build-optimizer,
,..
still spends much time

@bnfrnz

This comment has been minimized.

Copy link

bnfrnz commented May 3, 2018

I'm facing the same issue. Wasted days on trying to build with --prod. Made sure all imports are deep and accurate, increased memory size, stack size... basically tried all the advice I could find in the dozens of prod build related github issues I found across the various related repos... nothing helped. The prod build always freezes and all I can do is kill the process after a few hours.

Unfortunately, the README.md of this repo appears to be a bit outdated and not very helpful. The --cleancss and --uglifyjs flags for example don't seem to be supported by the latest version. I was trying to find out what exactly --prod actually does and it seems to me that it includes --optimizejs. I played around with the options and in my case this optimize script is the one that hangs.

@Bengejd, @ayaka209, If you also can't sort out the --prod build but urgently need a build, try leaving out --optimizejs option. I guess it's not ideal but for me it works and I just couldn't find another way.

Basically, instead of this
ionic cordova build ios --prod
do this
ionic cordova build ios --aot --minifyjs --minifycss --release

Would be great to find out why exactly --optimizejs doesn't work for me and be able to fix it since it is my understanding that it's supposed to bring performance improvements...

@ayaka209

This comment has been minimized.

Copy link

ayaka209 commented May 3, 2018

@bnfrnz thank you. but --aot --minifyjs --minifycss --release also takes much time on webpack. ( 400s )

I write a webpack.config.js and force it use ionic dev config for prod now: (./config/webpack.config.js)

var useDefaultConfig = require('@ionic/app-scripts/config/webpack.config.js');
module.exports = function () {
  let defaultConfig = useDefaultConfig;
  defaultConfig["prod"] = defaultConfig["dev"];
	return defaultConfig;
};

then it takes 80s (--prod) instead of 2000s+ (--prod without any change)

( do not forget to add config to package.json )

  "config": {
    "ionic_bundler": "webpack",
    "ionic_webpack": "./config/webpack.config.js"
  },

just a workaround.

my app takes 30s+ on startup if I don't use aot.

@Bengejd

This comment has been minimized.

Copy link
Author

Bengejd commented May 4, 2018

@bnfrnz thanks for the tip, I tried it just now, and it seems to be running the build as it's supposed to. Kind of a bummer that it doesn't work with --prod, but oh well. Best regards!

@Stradivario

This comment has been minimized.

Copy link

Stradivario commented May 4, 2018

Whaat @ayaka209 if you do this you will get JUST DEV so no need to run --prod argument :D whats the purpose ?

I have the same problem like you i try to put heap size on node more than 12 GB and Ionic consume all of it... but the build didn't succeed....

@Stradivario

This comment has been minimized.

Copy link

Stradivario commented May 4, 2018

@ayaka209

This comment has been minimized.

Copy link

ayaka209 commented May 5, 2018

@Stradivario benefit from aot and less build time than --aot

@Stradivario

This comment has been minimized.

Copy link

Stradivario commented May 5, 2018

@ayaka209 i am sure you are talking about "benefit from --prod"

AOT - Ahead of Time Compilation (remove all unused imports)
PROD - Only minify, concat, uglify without TreeShaking the bundle

My suggestion is try to use both --aot and --prod this will give you faster load of your application.

Regards,
Kristiyan Tachev

@ayaka209

This comment has been minimized.

Copy link

ayaka209 commented May 5, 2018

@Stradivario no, just aot. after replacing webpack config, concat, minify uglify is not done. they spend too much time..

@Leonavas

This comment has been minimized.

Copy link

Leonavas commented May 7, 2018

+1

1 similar comment
@Demi-ob

This comment has been minimized.

Copy link

Demi-ob commented May 9, 2018

+1

@audacitus

This comment has been minimized.

Copy link

audacitus commented May 9, 2018

@bnfrnz I really owe you a beer. I can't thank you enough for this workaround.

I have a project of about 20+ lazy loaded pages and had this issue using --prod after upping the memory to 12gb and waiting 2+ hours, I can confirm using --aot --minifyjs --minifycss vs prod workaround works for both web and android. I'm sure they'll fix it soon, but this works for me for now.

Thanks again!

@Demi-ob

This comment has been minimized.

Copy link

Demi-ob commented May 9, 2018

+1

1 similar comment
@LouAdrien

This comment has been minimized.

Copy link

LouAdrien commented May 11, 2018

+1

@LouAdrien

This comment has been minimized.

Copy link

LouAdrien commented May 11, 2018

I was able to get the live deploy working by editing the package.json script (following the previous mentioned fix) like this :

  "scripts": {
...
    "build": "ionic-app-scripts build --aot --minifyjs --minifycss --release",
...
  },

However I would feel much better when a fix comes and I can just put back the normal --prod setup

@nsaldarriagagluky

This comment has been minimized.

Copy link

nsaldarriagagluky commented May 15, 2018

+1

@freddiandrew

This comment has been minimized.

Copy link

freddiandrew commented May 18, 2018

any update fix this issue?
i still can`t build with --prod.

what is the benefit using this :
"build": "ionic-app-scripts build --aot --minifyjs --minifycss --release",

if we compare with --prod?

@Bengejd

This comment has been minimized.

Copy link
Author

Bengejd commented May 18, 2018

@bvamos

This comment has been minimized.

Copy link

bvamos commented May 19, 2018

I had the same problem yesterday. After several month of development --prod builds stopped without any error message. Last message was:
[21:38:15] copy finished in 18.14 s

After hours of looking for the problem, I've found this in C:\Users\user.ionic\daemon.log:

[ERROR] [2018-05-18T19:40:46.800Z] Could not get latest version of ionic.
...
[ERROR] [2018-05-19T07:49:24.325Z] An error occurred while running npm view ionic dist-tags.latest --json (exit code 1):
...
"summary": "getaddrinfo ENOTFOUND my-internal-npm-repo:443",
...

After I've fixed the connection to my internal npm repo, it works again.

Now log says:

[2018-05-19T07:51:43.216Z] Writing 7432 to daemon pid file (.\daemon.pid).
[2018-05-19T07:51:43.229Z] Spinning up communication server on port 53818.
[2018-05-19T07:51:43.518Z] Writing 53818 to daemon port file (.\daemon.port).
[2018-05-19T07:51:59.741Z] Writing daemon file.

I understand that my situation with internal npm proxy is not usual, but the point is that it is not always related to memory handling.

@GuilhermeBCC

This comment has been minimized.

Copy link

GuilhermeBCC commented May 20, 2018

+1
Probably a problem with Webpack 3.
As Ionic 3 will not receive any more updates, what we have left is to wait for Ionic 4 or to build a slower and longer build with the above solution.

@ze-termica

This comment has been minimized.

Copy link

ze-termica commented May 20, 2018

Who are getting the --prod freeze are using googlemaps too? I beleave that this problem is related with googlemaps.

@GuilhermeBCC

This comment has been minimized.

Copy link

GuilhermeBCC commented May 21, 2018

Hello, I have a solution.
comment the line:

function getProdLoaders() {
  if (process.env.IONIC_OPTIMIZE_JS === 'true') {
     //return optimizedProdLoaders; <==
  }
  return devConfig.module.loaders;
}

in node_modules/@ionic/app-scripts/config/webpack.config.js
run the command normally:
ionic cordova android --prod --release

@mfahrul

This comment has been minimized.

Copy link

mfahrul commented May 23, 2018

This issue begin after firebase@4.13.0 & 4.13.1
downgrade your firebase to firebase@4.12.1.
You can also use the latest firebase@5.0.3 and downgrade your @firebase/database to @firebase/database@0.2.1

This issue is on their github

@bnfrnz

This comment has been minimized.

Copy link

bnfrnz commented May 25, 2018

@GuilhermeBCC, I suspect what you're doing there is just a complicated approach to omitting the flag --optimizejs.

@mfahrul, thanks so much for referencing the issue from the firebase-js-sdk repo. This finally did the trick for me. Been fighting this for weeks.

For everyone who is using Firebase Realtime Database in their project, I highly recommend pinning your version to @firebase/database@0.2.1 and checking if that solves the problem, as advised by mfahrul.

I have no idea what updates have been made to @firebase/database between version 0.2.1 which was released 2 months ago and today. So I'm not actually sure which solution is better, downgrading or leaving out the optimizejs script during build.

@ze-termica, I'm not using googlemaps but it may still cause the problem in your case. Google's typings and libs are all over the place, unfortunately. Maybe try downgrading it as well and see if the issue was introduced in a recent version, as it happened in the case of firebase.

@GuilhermeBCC

This comment has been minimized.

Copy link

GuilhermeBCC commented May 25, 2018

Firebase again. Firebase is a headache.

@bnfrnz Do you think it best to omit the flag --prod and send it to production ??
I crawled and found where the problem is that is in the optimization of Ionic. I tested it and if you do it will have the same apk as before. To write this for sure you have not tested and verified the difference.

@mfahrul

This comment has been minimized.

Copy link

mfahrul commented May 25, 2018

@GuilhermeBCC
No, Firebase is not a headache. I've been playing with firebase for a while and i think its a powerful platform. Honestly i prefer to use native npm firebase package on ionic instead of angularfire. I am not agree to omit the --prod flag to send the apk for production release. In my experiences, there is a speed difference between production and debug version of apk. Apk generated with --prod is much faster then debug version because it is optimized. So omitting the --prod or commenting the optimizedProdLoaders is not the best solution.

@sengoontoh

This comment has been minimized.

Copy link

sengoontoh commented Jun 4, 2018

+1

@peterlai107

This comment has been minimized.

Copy link

peterlai107 commented Jun 26, 2018

+1

@saryuvc

This comment has been minimized.

Copy link

saryuvc commented Jul 12, 2018

I have tried all the solutions but still issue not resolved.the build process taking 2.5 hours

@dharapvj

This comment has been minimized.

Copy link

dharapvj commented Jul 14, 2018

For what it is worth.. below option has worked for me perfectly. The issue manifests when you have too many lazy loaded modules. It was isolated in ModuleConcatenation plugin and was fixed in Webpack 3.11.0

  1. add webpack 3.11.0 explicitely in your ionic app. Ionic app-scripts would automatically then pick your webpack.
  2. set node options to give somewhat higher memory.. you can play with this number until you get your build created.
npm i webpack@3.11.0 --save
set NODE_OPTIONS=--max_old_space_size=3000
ionic build --prod

This option works for me with 28 modules right now.

Hope that helps some people.

@bnfrnz

This comment has been minimized.

Copy link

bnfrnz commented Jul 14, 2018

Thanks @dharapvj. Unfortunately it doesn't do the trick in my case.

I pinned down the exact module that seems to be causing the freeze for me. It's any version higher than @firebase/database@0.2.1 and there are plenty of other developers with that issue. Firebase is a great suite of products. I'm a fan. But when it comes to dependencies and typings it's quite frustrating. Every update breaks something. I wonder if there's some sort of ES import issue or circle reference or so. Unfortunately they looked into it and concluded that the issue is probably on Ionic's side.

Basically, I can't build any Firebase project with --prod flag anymore. All I can do is use --aot --uglifyjs --minifyjs --minifycss --release and hope that someone will eventually fix whatever is going wrong...

@dharapvj

This comment has been minimized.

Copy link

dharapvj commented Jul 14, 2018

@amin2009

This comment has been minimized.

Copy link

amin2009 commented Jul 18, 2018

Same issue.

If you want to look into my source code, you can download here: https://goo.gl/bpdtfk

(I explained my issue in detail here: https://forum.ionicframework.com/t/ionic-build-freezes-after-copy-finished-in/135640

@bnfrnz

This comment has been minimized.

Copy link

bnfrnz commented Jul 22, 2018

@everyone: Updating @angular-devkit/build-optimizer finally fixed it for me. Have a look at this comment and give it a try.

@saryuvc

This comment has been minimized.

Copy link

saryuvc commented Jul 23, 2018

I have updated the app-scripts,web pack,angular 4 to 6 but still the problem persist.

@jayordway

This comment has been minimized.

Copy link

jayordway commented Jul 23, 2018

@saryuvc Did you just update app-scripts and not update the version of the angular-devkit/build-optimizer that it leverages?

@saryuvc

This comment has been minimized.

Copy link

saryuvc commented Jul 23, 2018

yes i have updated the app scripts from 3.1.0 to 3.1.11.

@jayordway

This comment has been minimized.

Copy link

jayordway commented Jul 23, 2018

@saryuvc That wouldn't update the build-optimizer though. You have to update that in the ionic-script's package.json itself and npm install @angular-devkit/build-optimizer

@saryuvc

This comment has been minimized.

Copy link

saryuvc commented Jul 23, 2018

ok let me try..thank you for reply

@saryuvc

This comment has been minimized.

Copy link

saryuvc commented Jul 23, 2018

Hello @jayordway i have updated the angular-devkit/build-optimizer in ionic-script's package.json and app's package.json. the build time is approximate 1 hour and 35 min from 2.5 hour.please note i have 30 up different modules with different pages.i have removed all the modules and with centralised module the prod release build time is 4 mins. so i think it is a issue of lazy loaded page. also , M not using firebase.

any solution ? please help me for same

This is my package.json

"dependencies": {
"@angular-devkit/build-optimizer": "0.6.8",
"@angular/common": "6.0.9",
"@angular/compiler": "6.0.9",
"@angular/compiler-cli": "6.0.9",
"@angular/core": "6.0.9",
"@angular/forms": "6.0.9",
"@angular/http": "6.0.9",
"@angular/platform-browser": "6.0.9",
"@angular/platform-browser-dynamic": "^6.0.9",
"@ionic-native/app-center-crashes": "^4.10.0",
"@ionic-native/call-number": "^4.10.0",
"@ionic-native/camera": "^4.10.0",
"@ionic-native/clipboard": "^4.10.0",
"@ionic-native/contacts": "^4.10.0",
"@ionic-native/core": "4.10.0",
"@ionic-native/crop": "^4.10.0",
"@ionic-native/file": "^4.10.0",
"@ionic-native/google-plus": "^4.10.0",
"@ionic-native/in-app-browser": "^4.10.0",
"@ionic-native/keyboard": "^4.10.0",
"@ionic-native/linkedin": "^4.10.0",
"@ionic-native/native-storage": "^4.10.0",
"@ionic-native/network": "^4.10.0",
"@ionic-native/sms": "^4.10.0",
"@ionic-native/social-sharing": "^4.10.0",
"@ionic-native/splash-screen": "4.10.0",
"@ionic-native/status-bar": "4.10.0",
"@ionic-native/themeable-browser": "^4.10.0",
"@ionic/storage": "^2.1.3",
"@ngx-translate/core": "^10.0.2",
"@ngx-translate/http-loader": "^3.0.1",
"android": "0.0.8",
"call-number": "^1.0.1",
"clipboard": "^2.0.1",
"cordova-android": "7.0.0",
"cordova-clipboard": "^1.2.1",
"cordova-plugin-appcenter-crashes": "^0.1.7",
"cordova-plugin-appcenter-shared": "^0.1.7",
"cordova-plugin-camera": "^4.0.3",
"cordova-plugin-contacts": "^3.0.1",
"cordova-plugin-crop": "^0.4.0",
"cordova-plugin-device": "^2.0.2",
"cordova-plugin-file": "^6.0.1",
"cordova-plugin-ionic-keyboard": "^2.1.2",
"cordova-plugin-ionic-webview": "^1.2.1",
"cordova-plugin-network-information": "^2.0.1",
"cordova-plugin-splashscreen": "^5.0.2",
"cordova-plugin-statusbar": "^2.4.2",
"cordova-plugin-themeablebrowser": "^0.2.17",
"cordova-plugin-whitelist": "^1.3.3",
"cordova-plugin-x-socialsharing": "^5.4.1",
"cordova-sms-plugin": "^0.1.11",
"cordova-sqlite-storage": "^2.3.3",
"es6-promise-plugin": "^4.2.2",
"ionic-angular": "3.9.2",
"ionic-select-searchable": "^2.8.1",
"ionicons": "4.2.4",
"jquery": "^3.3.1",
"mime-types": "^2.1.19",
"mx.ferreyra.callnumber": "0.0.2",
"ng2-translate": "^5.0.0",
"raven-js": "^3.26.3",
"rxjs": "^6.2.2",
"rxjs-compat": "^6.2.2",
"sw-toolbox": "3.6.0",
"zone.js": "0.8.26"
},
"devDependencies": {
"@ionic/app-scripts": "3.1.8",
"typescript": "2.7.2",
"ws": "5.2.2"
},
"description": "An Ionic project",
"cordova": {
"plugins": {
"cordova-plugin-whitelist": {},
"cordova-plugin-device": {},
"cordova-plugin-splashscreen": {},
"cordova-plugin-ionic-webview": {},
"cordova-sms-plugin": {},
"cordova-plugin-contacts": {},
"cordova-plugin-x-socialsharing": {},
"cordova-plugin-themeablebrowser": {},
"cordova-sqlite-storage": {},
"cordova-plugin-network-information": {},
"cordova-plugin-statusbar": {},
"cordova-plugin-camera": {},
"cordova-plugin-ionic-keyboard": {},
"cordova-plugin-crop": {},
"mx.ferreyra.callnumber": {},
"call-number": {},
"cordova-clipboard": {},
"cordova-plugin-file": {},
"cordova-plugin-appcenter-crashes": {}
},

@Bengejd

This comment has been minimized.

Copy link
Author

Bengejd commented Jul 24, 2018

So I opened this issue 84 days ago, and we still haven't had it addressed by the Ionic team, unfortunately. Running the following works (for me anyways). This seems to be an issue with large apps with multiple modules (as one would want for lazy loading purposes) as mentioned here, and firebase after a certain version which was addressed here as an ionic issue that Firebase was inadvertandly causing.

npm install @angular-devkit/build-optimizer@0.6.8
npm install webpack@3.11.0
npm install @ionic/app-scripts@3.1.11
node --max-old-space-size=8192 (You can play around with this number).

After running these commands, it finishes the webpack portion of the build in about 120s. And then continues through the rest of it without a hitch. My project has roughly lazy loaded 70+ modules in it. I'll post my current package.json below so that you can compare the packages you have to mine. This seems to be working with firebase@5.3.0 just fine.

"dependencies": {
    "@angular-devkit/build-optimizer": "^0.6.8",
    "@angular/animations": "5.2.11",
    "@angular/common": "5.2.11",
    "@angular/compiler": "5.2.11",
    "@angular/compiler-cli": "5.2.11",
    "@angular/core": "5.2.11",
    "@angular/forms": "5.2.11",
    "@angular/http": "5.2.11",
    "@angular/platform-browser": "5.2.11",
    "@angular/platform-browser-dynamic": "5.2.11",
    "@ionic-native/base64": "^4.10.0",
    "@ionic-native/camera": "4.3.3",
    "@ionic-native/camera-preview": "^4.10.0",
    "@ionic-native/core": "4.9.1",
    "@ionic-native/file": "^4.10.0",
    "@ionic-native/geolocation": "^4.10.0",
    "@ionic-native/google-maps": "^4.9.1",
    "@ionic-native/keyboard": "^4.10.0",
    "@ionic-native/onesignal": "^4.10.0",
    "@ionic-native/splash-screen": "4.9.1",
    "@ionic-native/status-bar": "4.9.1",
    "@ionic/pro": "^1.0.20",
    "@ionic/storage": "2.1.3",
    "algoliasearch": "^3.29.0",
    "angularfire2": "^5.0.0-rc.11",
    "animate.css": "^3.6.1",
    "bourbon": "^5.1.0",
    "branch-cordova-sdk": "^3.0.0",
    "build": "0.1.4",
    "clg-color": "^1.1.2",
    "com-badrit-base64": "^0.2.0",
    "cordova-ios": "4.5.4",
    "cordova-plugin-camera": "^4.0.3",
    "cordova-plugin-camera-preview": "git+https://github.com/cordova-plugin-camera-preview/cordova-plugin-camera-preview.git",
    "cordova-plugin-compat": "^1.2.0",
    "cordova-plugin-device": "^2.0.2",
    "cordova-plugin-file": "^6.0.1",
    "cordova-plugin-geolocation": "^4.0.1",
    "cordova-plugin-googlemaps": "^2.3.8",
    "cordova-plugin-ionic-keyboard": "^2.0.5",
    "cordova-plugin-ionic-webview": "^1.1.19",
    "cordova-plugin-photo-library": "^2.1.1",
    "cordova-plugin-splashscreen": "^5.0.2",
    "cordova-plugin-whitelist": "^1.3.3",
    "date-fns": "^1.29.0",
    "firebase": "^5.3.0",
    "geofirestore": "^1.2.0",
    "hammerjs": "^2.0.8",
    "ionic-angular": "3.9.2",
    "ionic-image-loader": "^5.0.5",
    "ionic-plugin-keyboard": "^2.2.1",
    "ionicons": "3.0.0",
    "lodash": "^4.17.10",
    "minimist": "^1.2.0",
    "ng-click-outside": "^4.0.0",
    "onesignal-cordova-plugin": "^2.4.1",
    "rxjs": "^5.5.11",
    "rxjs-compat": "^6.2.2",
    "sw-toolbox": "3.6.0",
    "xml2js": "^0.4.19",
    "zone.js": "0.8.26"
  },
  "devDependencies": {
    "@ionic/app-scripts": "^3.1.11",
    "@types/node": "^10.5.2",
    "typescript": "~2.6.2",
    "webpack": "^3.11.0"
  },
  "config": {
    "ionic_sass": "./config/sass.config.js"
  }

Just for continuity, here is my sass.config.js that could help speed up some build times (but not by a ton, I don't believe.


// https://www.npmjs.com/package/node-sass

module.exports = {

  /**
   * outputFilename: The filename of the saved CSS file
   * from the sass build. The directory which it is saved in
   * is set within the "buildDir" config options.
   */
  outputFilename: process.env.IONIC_OUTPUT_CSS_FILE_NAME,

  /**
   * sourceMap: If source map should be built or not.
   */
  sourceMap: false,

  /**
   * outputStyle: How node-sass should output the css file.
   */
  outputStyle: 'expanded',

  /**
   * autoprefixer: The config options for autoprefixer.
   * Excluding this config will skip applying autoprefixer.
   * https://www.npmjs.com/package/autoprefixer
   */
  autoprefixer: {
    browsers: [
      'last 2 versions',
      'iOS >= 8',
      'Android >= 4.4',
      'Explorer >= 11',
      'ExplorerMobile >= 11'
    ],
    cascade: false
  },

  /**
   * includePaths: Used by node-sass for additional
   * paths to search for sass imports by just name.
   */
  includePaths: [
    'node_modules/ionic-angular/themes',
    'node_modules/ionicons/dist/scss',
    'node_modules/ionic-angular/fonts',
    'node_modules/bourbon/core'
    // 'node_modules/bourbon/app/assets/stylesheets'
  ],

  /**
   * includeFiles: An array of regex patterns to search for
   * sass files in the same directory as the component module.
   * If a file matches both include and exclude patterns, then
   * the file will be excluded.
   */
  includeFiles: [
    /\.(s(c|a)ss)$/i
  ],

  /**
   * excludeFiles: An array of regex patterns for files which
   * should be excluded. If a file matches both include and exclude
   * patterns, then the file will be excluded.
   */
  excludeFiles: [
    /*  /\.(wp).(scss)$/i  */
  ],

  /**
   * variableSassFiles: Lists out the files which include
   * only sass variables. These variables are the first sass files
   * to be imported so their values override default variables.
   */
  variableSassFiles: [
    '{{SRC}}/theme/variables.scss'
  ],

  /**
   * directoryMaps: Compiled JS modules may be within a different
   * directory than its source file and sibling component sass files.
   * For example, NGC places it's files within the .tmp directory
   * but doesn't copy over its sass files. This is useful so sass
   * also checks the JavaScript's source directory for sass files.
   */
  directoryMaps: {
    '{{TMP}}': '{{SRC}}'
  },

  /**
   * excludeModules: Used just as a way to skip over
   * modules which we know wouldn't have any sass to be
   * bundled. "excludeModules" isn't necessary, but is a
   * good way to speed up build times by skipping modules.
   */
  excludeModules: [
    '@angular',
    'commonjs-proxy',
    'core-js',
    'ionic-native',
    'rxjs',
    'zone.js'
  ]

};
@sameer05k21a0440

This comment has been minimized.

Copy link

sameer05k21a0440 commented Aug 5, 2018

Hi, When I run my application with ionic serve --lab freeze it like that message
[INFO] Waiting for connectivity with ionic-app-scripts...
[INFO] Waiting for connectivity with ionic-app-scripts...
[INFO] Waiting for connectivity with ionic-app-scripts...
[INFO] Waiting for connectivity with ionic-app-scripts...
[INFO] Waiting for connectivity with ionic-app-scripts...
[INFO] Waiting for connectivity with ionic-app-scripts...

@Bengejd

This comment has been minimized.

Copy link
Author

Bengejd commented Aug 5, 2018

@sameer05k21a0440 please post your package.json file so we can see what you are running. Did you follow the steps I listed above, and then it began freezing, or is this a seperate issue? If it is, I recommend opening a new issue, because the two are not linked (to my knowledge), though I haven't used ionic serve --lab in quite some time on my app, since It requires native functionality, and I haven't bothered implementing connecting classes quite yet.

@ghost

This comment has been minimized.

Copy link

ghost commented Aug 6, 2018

I am stuck here, looks like same issue, can some one point to a solution that works

> ionic-app-scripts build --prod --target cordova --platform android
[13:54:07]  ionic-app-scripts 3.1.11 
[13:54:07]  build prod started ... 
[13:54:08]  clean started ... 
[13:54:08]  clean finished in 16 ms 
[13:54:08]  copy started ... 
[13:54:08]  deeplinks started ... 
[13:54:08]  deeplinks finished in 77 ms 
[13:54:08]  ngc started ... 
[13:54:36]  ngc finished in 28.17 s 
[13:54:36]  preprocess started ... 
[13:54:36]  preprocess finished in 2 ms 
[13:54:36]  webpack started ... 
[13:54:37]  copy finished in 29.07 s 

Ionic info

Ionic:

   ionic (Ionic CLI)  : 4.0.3 
   Ionic Framework    : ionic-angular 3.9.2
   @ionic/app-scripts : 3.1.11

Cordova:

   cordova (Cordova CLI) : 8.0.0
   Cordova Platforms     : android 7.1.0

System:

   Android SDK Tools : 25.2.5
   ios-deploy        : 1.9.1
   ios-sim           : 5.0.8
   NodeJS            : v8.11.3 
   npm               : 6.3.0
   OS                : macOS High Sierra

@ghost

This comment has been minimized.

Copy link

ghost commented Aug 6, 2018

For me this worked

ionic cordova build android --aot --uglifyjs --minifyjs --minifycss --release

and takes 30 mins on MAC Book Pro :) good luck if you are on windows :)

@germanriverahdez

This comment has been minimized.

Copy link

germanriverahdez commented Aug 7, 2018

Just downgrade to firebase@4.12.1.

This fix the problem for me.

@saryuvc

This comment has been minimized.

Copy link

saryuvc commented Aug 31, 2018

Hello,

Please remove www folder,node modules,platforms, and npm install

please note : I have updated to ionic 4 and cordova 8.

this solved my issue.

@ailsoncgt

This comment has been minimized.

Copy link

ailsoncgt commented Sep 7, 2018

Tks @germanriverahdez, your solution works for me

@AniciusM

This comment has been minimized.

Copy link

AniciusM commented Oct 31, 2018

Yep doing npm install latest versions of webpack and build-optimizer seems to be fixing the problem with firebase's libs

@adamduren

This comment has been minimized.

Copy link

adamduren commented Oct 31, 2018

It would be nice to see something from Ionic on this and other V3 related issues. Maybe an update to ionic-app-scripts or a path to use the angular-cli for v3 projects. I've been following many issues, some even with PRs but they seem to get no attention since all of the focus is on V4.

It's unfortunate, because event after the V4 there will be a large portion of the community that will not be able to migrate to V4 even once it's officially released, at least for a period of time. When AngularJS went towards Angular 2 they announced a plan to monitor the community and provide support for AngularJS until Angular 2 hit a certain adoption rate IIRC.

@pipoa

This comment has been minimized.

Copy link

pipoa commented Nov 11, 2018

Some hints to notify eveybody,

  1. NODE_OPTIONS was landed in 8.x+ , if you want to use NODE_OPTIONS, remember to upgrade ur node
    how to upgrade

  2. in Mac, without 8.x node, what I did is:
    $ which ionic
    /usr/local/bin/ionic
    $ nano /usr/local/bin/ionic
    at first line , change
    #!/usr/bin/env node
    to
    #!/usr/bin/env node --max-old-space-size=4096

then, you can compile as usual
$ ionic cordova build ios --prod --release
$ npm run ionic:build --prod --release

  1. The best way is using NODE_OPTIONS
    in your .bash_profile, added
    export NODE_OPTIONS=--max-old-space-size=4096

  2. I DON'T recommend escape --optimizejs, using command below won't reference to you "prod" ENV, if you have one. It runs without webpack 'prodConfig', I don't know what were lost.
    $ npm run ionic:build --minifyjs --minifycss --release --aot (X not recommended)

  3. How to know that your problem is really caused by Heap Size Limit ?
    first, run below command without success
    $ node /usr/local/bin/ionic cordova build android --prod --release
    run below command with success
    $ node --max-old-space-size=4096 /usr/local/bin/ionic cordova build android --prod --release

@david95thinkcode

This comment has been minimized.

Copy link

david95thinkcode commented Nov 19, 2018

Downgrade solution didn't works for me.

This one works for me : ionic cordova build android --aot --minifyjs --minifycss --release 🙂

Thanks to @bnfrnz

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session.