몇 시간 전에 Ionic 5가 발표 되었고 (2020 년 2 월 12 일) 작은 생산 앱 중 하나를 Angular 9와 함께 Ionic 5로 업그레이드했습니다.
# To update to Ionic 5
npm install @ionic/angular@latest @ionic/angular-toolkit@latest --save-exact --save
# To update to Angular 9
ng update @angular/core @angular/cli
그러나 내가 할 때 ionic serve벨로 오류가 발생하기 시작했습니다.
Error: Angular JIT compilation failed: '@angular/compiler' not loaded!
- JIT compilation is discouraged for production use-cases! Consider AOT mode instead.
- Did you bootstrap using '@angular/platform-browser-dynamic' or '@angular/platform-server'?
- Alternatively provide the compiler with 'import "@angular/compiler";' before bootstrapping.
at getCompilerFacade (core.js:610)
at Function.get (core.js:16065)
at getInjectableDef (core.js:362)
at injectableDefOrInjectorDefFactory (core.js:16816)
몇 가지 Angular GitHub 문제가 발생했습니다.
그들은 포함하는 말 import '@angular/compiler';에 main.ts파일하지만 (나는 최근에 업데이트) 내 다른 각도 9 응용 프로그램 중 하나를 일치 할 때, 나는 거기 이러한 구성을 볼 수 없습니다.
Angular 9는 Ionic 5와 호환되지 않습니까?
답변
이 문제를 해결하기 위해 업데이트 및 올바른 솔루션
Tran Quang 의 답변을 바탕으로 CHANGELOG.md 를 보았고 ionic-native최근 Angular 9로 컴파일하기 위해 패키지를 업데이트했음을 알게되었습니다.
따라서의 모든 종속성을 업데이트해야합니다 @ionic-native. 이를 위해 package.gson파일의 모든 종속성을 살펴보고 @ionic-native/하나씩 업데이트하십시오.
예를 들어, 이것은 내 package.gson:
따라서 모든 @ionic-native종속성 을 업데이트하려면 다음 명령을 실행해야했습니다 .
npm i @ionic-native/core@latest
npm i @ionic-native/camera@latest
npm i @ionic-native/firebase-x@latest
npm i @ionic-native/splash-screen@latest
npm i @ionic-native/status-bar@latest
@ionic-native의존성에 대해서도 마찬가지입니다. v5.21.5이전 릴리스가 작동하지 않았기 때문에 최소로 업데이트되었는지 확인하십시오 .
건배 😀🎉🎊
어떤 이유로 든 @ionic-native종속성을 업데이트 할 수없는 경우 다른 해결 방법 / 솔루션에 대한 내 원래 답변을보십시오 ⬇️
원래 답변
나를 위해 다음 솔루션이 효과가있었습니다. 그들이 완벽하게 추가되는지 확실하지 않지만 Ionic 팀이 일반 Angular 앱을 Angular 9로 업그레이드 할 때 이러한 솔루션이 필요하지 않았기 때문에이 문제를 해결할 것으로 기대합니다.
해결책 1
변경하여 AOT를 끄고 "aot": true에 "aot: false에 angular.json파일. 이것이 Angular 앱의 성능을 향상시키고 개발 모드에서 오류 코드를 잡는 것을 향상시키기 때문에 이것을 권장하지 않습니다.
해결책 2
변경하지 angular.json않고이 문제 ionic serve만 해결하려면 다음 을 사용하여 --aot=false플래그를 ngcommand에 전달하십시오 --.
ionic serve -- --aot=false
솔루션 3 (블라인드 옵션)
위의 해결 방법으로도 효과가 없으면 명령 npm update을 실행하여 문자 그대로 모든 종속성을 업데이트합니다 package.json(즉, 이온 종속성도 업데이트 됨).
업데이트 된 종속성과 업데이트 된 종속성의 주요 변경 사항에 대해 알지 못하므로 맹목적인 옵션입니다. 따라서 이로 인해 다른 문제가 해결 될 수 있습니다.
따라서이 위험을 감수하는 것은 당신에게 달려 있습니다 🙂 글쎄, 이것은 앱이 그렇게 크지 않거나 새로운 의존성에서 제거 된 코드를 사용하지 않으면 가치가 있습니다.
솔루션 4 (마지막 및 최악의 옵션)
추가 import '@angular/compiler';로 main.ts파일. 그러나 이것은 번들 크기를 증가시킬 수 있습니다 .
특별한
이온을 업그레이드하는 동안, 당신 때문에 잘못의 또 다른 문제에 직면 할 수 import에서 polyfills.ts. 그렇다면 Ionic 5로 업그레이드 한 후 TypeScript 컴파일에서 src / zone-flags.ts가 누락 되었는지 확인하십시오
답변
Angular의 경우 : 터미널을 중지하고 다시 예약 ng serve하면 문제가 해결되었습니다.
답변
시도해보십시오 ng serve --aot. 문제를 해결하는 데 도움이되었습니다. 즉, 프로덕션 빌드와 비슷하기 때문에 권장되는 aot로 실행하려는 경우 더 빨리 오류를 포착하는 데 도움이됩니다.
도움이 되었기를 바랍니다.
답변
이온 업데이트가 빠르지 않기 때문에 시도해 볼 수 있습니다
npm i @ionic-native/status-bar@beta @ionic-native/splash-screen@beta @ionic-native/core@beta -S.
업데이트 2020/02/18 => npm i @ionic-native/status-bar @ionic-native/splash-screen @ionic-native/core -S최신 안정 버전을 얻기 위해 지금 실행할 수 있습니다
답변
이온도 업데이트해야 작동합니다. 업데이트 버전의 각도의 경우 모든 종속 자체를 업데이트합니다. 그러나 이온에서는 수동으로 업데이트해야합니다.
"@angular/common": "9.0.5",
"@angular/core": "9.0.5",
"@angular/forms": "9.0.5",
"@angular/platform-browser": "9.0.5",
"@angular/platform-browser-dynamic": "9.0.5",
"@angular/router": "9.0.5",
"@ckeditor/ckeditor5-angular": "1.2.2",
"@ckeditor/ckeditor5-build-classic": "17.0.0",
"@ionic-native/camera": "5.22.0",
"@ionic-native/core": "5.22.0",
"@ionic-native/crop": "5.22.0",
"@ionic-native/device": "5.22.0",
"@ionic-native/diagnostic": "5.22.0",
"@ionic-native/document-viewer": "5.22.0",
"@ionic-native/file": "5.22.0",
"@ionic-native/file-opener": "5.22.0",
"@ionic-native/file-path": "5.22.0",
"@ionic-native/file-transfer": "5.22.0",
"@ionic-native/fingerprint-aio": "5.22.0",
"@ionic-native/image-picker": "5.22.0",
"@ionic-native/in-app-browser": "5.22.0",
"@ionic-native/network": "5.22.0",
"@ionic-native/splash-screen": "5.22.0",
"@ionic-native/status-bar": "5.22.0",
"@ionic-native/toast": "5.22.0",답변
실행 npm update하면 문제가 해결되었습니다.
답변
