離子服務無法獲取/找不到模塊“@ionic-native/splash-screen/ngx”

Question

我正在嘗試運行 Ionic 並使用 Ionic 框架Ionic 文檔教程進行安裝，但是當我運行 Ionic serve 時，我的瀏覽器打開一個錯誤，“無法獲取 /”

我使用npm install -g @ionic/cli並創建了基本模板選項卡， ionic start myApp tabs

這是離子發球的錯誤

> ng run app:serve --host=localhost --port=8100
[ng] Browserslist: caniuse-lite is outdated. Please run next command `npm update`
[ng] ℹ ｢wds｣: Project is running at http://localhost:8100/webpack-dev-server/
[ng] ℹ ｢wds｣: webpack output is served from /
[ng] ℹ ｢wds｣: 404s will fallback to //index.html
[ng] chunk {main} main.js, main.js.map (main) 2.03 kB [initial] [rendered]
[ng] chunk {polyfills} polyfills.js, polyfills.js.map (polyfills) 149 kB [initial] [rendered]
[ng] chunk {runtime} runtime.js, runtime.js.map (runtime) 6.09 kB [entry] [rendered]
[ng] chunk {styles} styles.js, styles.js.map (styles) 109 kB [initial] [rendered]
[ng] chunk {vendor} vendor.js, vendor.js.map (vendor) 339 kB [initial] [rendered]
[ng] Date: 2020-02-11T03:56:39.914Z - Hash: 9860ec75ab31a30a881b - Time: 5271ms
[ng] 
[ng] ERROR in src/app/app.component.ts:4:30 - error TS2307: Cannot find module '@ionic-native/splash-screen/ngx'.
[ng] 4 import { SplashScreen } from '@ionic-native/splash-screen/ngx';
[ng]                                ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
[ng] src/app/app.module.ts:6:30 - error TS2307: Cannot find module '@ionic-native/splash-screen/ngx'.
[ng] 6 import { SplashScreen } from '@ionic-native/splash-screen/ngx';
[ng]                                ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
[ng] 

[INFO] Development server running!

       Local: http://localhost:8100

       Use Ctrl+C to quit this process

[INFO] Browser window opened to http://localhost:8100!

[ng] ℹ ｢wdm｣: Failed to compile.

這是我的離子信息

Ionic:

   Ionic CLI                     : 6.0.2 (/usr/local/lib/node_modules/@ionic/cli)
   Ionic Framework               : @ionic/angular 4.11.10
   @angular-devkit/build-angular : 0.801.3
   @angular-devkit/schematics    : 8.1.3
   @angular/cli                  : 8.1.3
   @ionic/angular-toolkit        : 2.1.2

Capacitor:

   Capacitor CLI   : 1.5.0
   @capacitor/core : 1.5.0

Utility:

   cordova-res : not installed
   native-run  : not installed

System:

   NodeJS : v13.2.0 (/usr/local/bin/node)
   npm    : 6.13.1
   OS     : macOS Catalina

奇怪的是，當我為實驗室運行ionic serve -l ，它給了我 2 個黑屏而不是基本模板選項卡。

我已經嘗試刪除節點模塊文件夾並重新運行 npm install，但我仍然遇到相同的錯誤。

我的 package.json 確實包含 @ionic-native

    "@ionic-native/core": "^5.0.0",
    "@ionic-native/splash-screen": "^5.0.0",
    "@ionic-native/status-bar": "^5.0.0",

我如何獲得@ionic-native/splash-screen/ngx？

Answer 1

我通過運行解決了這個問題

ionic build

在離子服務之前

快樂編碼。

Answer 2

使用此命令導入丟失的包：

npm install --save @ionic-native/splash-screen

Answer 3

我剛剛更新到 Ionic CLI 6.1.0 和 Framework Angular 5.0.0，這個錯誤不再發生。

首先檢查您的依賴項，轉到 ionic 文件夾並輸入 % npm list --depth=0 修復所有依賴項，如果仍然不起作用，則繼續下面的說明，這些可能會也可能不會起作用，因為它適用於選項卡，空白和側菜單，但是當我安裝會議應用程序時，它現在可以通過 ionic serve 完美運行。

[ng] 4 import { SplashScreen } from '@ionic-native/splash-screen/ngx';

所以在離子框架版本@ionic/angular 4.11.6和ionic cli 6.0+上，@ionic-native/splash-screen/ngx不存在，解決辦法是去掉/ngx。

Aka change import { SplashScreen } from '@ionic-native/splash-screen/ngx'; import { SplashScreen } from '@ionic-native/splash-screen';

隨處可見，而且似乎默認情況下會在空白、選項卡和側菜單、會議應用程序模板中添加它。

默認情況下它存在於 src/apps/app.components.ts 和 src/apps/app.modules.ts

Answer 4

我剛才也有同樣的問題。 幸運的是，這就是我修復它的方式

Ctrl + C 退出，然后在終端輸入 npm update，最后再次運行 ionic serve

祝你好運！

Answer 5

就我而言，這是代碼中的語法錯誤。 在“ionic serve”之前運行“ionic build --verbose”有幫助。