Ionic serve无法获取/找不到模块‘@ionic native/splash-screen/ngx’

Question

我正在尝试运行Ionic并使用Ionic框架Ionic docs教程进行安装，但是当我运行Ionic服务时，我的浏览器打开时出现错误，'Cannot GET /‘

我使用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时，它给出了两个黑屏，而不是基本的模板选项卡。

我尝试删除node modules文件夹并重新运行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 CLI 6.1.0和Framework Angular 5.0.0，这个错误不会再发生了。

首先检查你的依赖项，转到ionic文件夹，输入% npm list --depth=0修复所有依赖项，如果仍然不起作用，然后继续下面的说明，这些可能会也可能不会起作用，因为它适用于制表符、空白和sidemenu，但当我安装会议应用程序时，它现在可以通过ionic服务完美地工作。

NG4从‘@ionic-native/splash-screen/ngx’导入{ SplashScreen }；

因此，在ionic框架版本@ ionic /angular 4.11.6和ionic cli 6.0+上，@ionic-native/splash-screen/ngx不存在，解决方案是删除/ngx。

Aka将import { SplashScreen } from '@ionic-native/splash-screen/ngx';更改为import { SplashScreen } from '@ionic-native/splash-screen';

随处可见，而且默认情况下，它似乎会在空白、tab、sidemenu、会议应用程序模板中添加该功能。

默认情况下，它存在于src/apps/app.components.ts和src/apps/app.modules.ts中

Answer 2

我通过运行以下命令解决了这个问题

ionic build

在离子服务之前

编码愉快。

Answer 3

使用以下命令导入缺少的软件包：

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