IONIC 5 ionic serve produces Error: NGCC failed - ionic-framework

I created a new ionic 5 project by using
ionic start myApp blank
When I run the project in browser using ionic serve it has given the following error
Error: NGCC failed

I figured out the problem my self
The problem was when I was installing the latest npm packages
it was installing the typescript: 4.0.2 and thats why the NGCC error
occured
run the following command and it will work,
npm i typescript#">=3.9.2 <4.0.0”
Or in future some one faces this error this is about the typescript version so just install the valid typescript and you will fix the ngcc error

Related

after ionic v3 to ionic v5 migration - ionic build command not working

We have migrated from ionic v3 to ionic v5 ... ionic serve command working but showing blank page when launched.
ionic build command throwing following error..
[11:57:17] ionic-app-script task: "build"
[11:57:17] TypeError: Cannot read property 'compilation' of undefined
TypeError: Cannot read property 'compilation' of undefined
at DefinePlugin.apply (/Users/upgrade/node_modules/webpack/lib/DefinePlugin.js:280:18)
at Compiler.apply (/Users/upgrade/node_modules/#ionic/app-scripts/node_modules/tapable/lib/Tapable.js:375:16)
at webpack (/Users/upgrade/node_modules/#ionic/app-scripts/node_modules/webpack/lib/webpack.js:33:19)
at /Users/upgrade/node_modules/#ionic/app-scripts/dist/webpack.js:132:24
at new Promise ()
at runWebpackFullBuild (/Users/upgrade/node_modules/#ionic/app-scripts/dist/webpack.js:113:12)
at webpackWorker (/Users/upgrade/node_modules/#ionic/app-scripts/dist/webpack.js:70:19)
at Object.webpack (/Users/upgrade/node_modules/#ionic/app-scripts/dist/webpack.js:29:12)
at bundleWorker (/Users/upgrade/node_modules/#ionic/app-scripts/dist/bundle.js:13:22)
at Object.bundle (/Users/upgrade/node_modules/#ionic/app-scripts/dist/bundle.js:6:12)
[ERROR] An error occurred while running subprocess ionic-app-scripts.
ionic-app-scripts build exited with exit code 1.
Re-running this command with the --verbose flag may provide more information.
we need to use this project for all 3 platform i.e. browser, android and ios .. so for that purpose we need www folder with files. ionic build command achieve this.
how should i fix this ...
Create a new project using ionic 6, migrate cordova plugins to capacitor and copy over code. This is your best bet. Goodluck.

Upgrade to Ionic 5 with Angular 9 from Ionic 4 / Angular 7

There is a great tutorial video on the official Ionic YouTube channel which will show you a best-case scenario for upgrading to Ionic 5 and Angular 9.
However for my simple prototype app that I had made last year (just a demo that let me reorder a list) I tried to update but almost immediately came off the rails.
It turned out to be using "#angular/core": "^7.2.2" which broke the app from ionic serve because it was expecting Angular 8.
Then I tried to run the ng upgrade but got hit with incompatible peer dependencies for codelyzer, #ionic/angular-toolkit, and #angular/http.
So I tried to upgrade to Angular 8 first with npm i #angular/core#"~8.x.x" but that failed as it needed npm i zone.js#~0.9.1.
How can I update successfully to the latest and greatest?
So for people coming from angular 7 it seems for this project the correct upgrade commands are:
npm i #ionic/angular#latest
npm i zone.js#~0.9.1
npm i #angular/core#"~8.x.x"
npm i #ionic/angular-toolkit#latest
npm i codelyzer#latest
npm remove #angular/http
ng update #angular/core #angular/cli --allow-dirty
and it finally updated everything. However I did see a warning saying Package not installed: "--allow-dirty". Skipping.
However, then after that I dared to try ionic build and it failed with this error, which got me stuck for another 15 minutes:
zone-flags.ts is missing from the TypeScript compilation.
It seems that the polyfills.ts uses the .ts extension in the include which is breaking the compilation.
I changed this line in polyfills.ts:
import './zone-flags.ts';
To this:
import './zone-flags';
AND IT COMPILED.
But did it ionic serve?
No. No it did not.
The browser showed this in the console:
Error: Angular JIT compilation failed: '#angular/compiler' not loaded!
So after some more searching, I found that if you open main.ts and then add
import '#angular/compiler';
Near the top then all will be right and good with the world once more...
...unless your project then needs the markup breaking changes resolving, but you're on your own for that.

Ionic config directory error. (How to solve)

I have a issue using ionic on my mac. I've cloned my repo and started it with ionic serve. But if I use control C and stop the command ant start it again I get this error "Cannot read property 'IONIC_CONFIG_DIRECTORY' of undefined".
Same problem here. Found the solution: https://forum.ionicframework.com/t/ionic-commands-not-working-after-update-ionic/146492/3
Solution:
npm uninstall ionic cordova
npm install ionic cordova

ionic 2 error when start new project

E:\SocialLoginDemo>ionic start HelloWorld12 blank --v2
Creating Ionic app in folder E:\SocialLoginDemo\HelloWorld12 based on blank project
Installing npm packages...
Error with start undefined
Error Initializing app: There was an error with the spawned command: npminstall
There was an error with the spawned command: npminstall
Caught exception:
undefined
Mind letting us know? https://github.com/driftyco/ionic-cli/issues
my version information
Your system information:
You have been opted out of telemetry. To change this, run: cordova
telemetry on.
6.3.1
Ionic CLI Version:2.1.0
Ionic App Lib Version: 2.1.0-beta.1
OS: Node Version:v4.6.0
There was some problem in spawned command "npminstall" but now they have fixed this issue. Mostly it should work now and if not kindly share screenshot of errors being thrown.

Error: Cannot find module 'semver'

I was working on a simple Ionic App.
Steps taken:
updated ionic - OK
started new project - OK
created a couple of pages- OK
served the app - OK
but then I tried to add the android platform:
ionic platform add android
and got this error:
ERROR: Cannot find module 'semver'
at Function.Module._resolveFilename (module.js:336:15)
Caught exception:
undefined
Any idea on why I'm getting this error and how to fix it?
Thanks!
i faced same issue and i fix with below coment
sudo rm -rf node_modules/ package-lock.json
Looks like you're just missing a node module dependency. Try running npm install semver inside your project dir.