现有Angular 4项目中的离子框架

Question

我正在使用自己的CSS进行角度项目，现在几乎完成了我想在我的项目中使用带有cordova的离子框架。我试过但它不起作用。

是否有任何方法和一步一步的过程在我现有的Angular 4项目中添加离子框架。

我可以有任何链接或指导来实现我的目标。

提前致谢

Answer 1

我在这里记录了我的方法：

https://stack247.wordpress.com/2019/03/11/integrate-ionic-in-existing-angular-project/

这适用于

• Angular 7。
• 离子5。

基本上，这些是步骤：

这一步包括使用Ionic CLI创建一个新项目，我将把它称为Ionic项目，而我的原始Angular项目就是Angular项目。

• 在你的Angular项目中，如果可以的话，将所有npm包更新到最新的主要包。这是为了避免版本与Ionic项目的npm包冲突。
• 开始一个新的离子空白项目。 ionic start project-name blank
• 更新新创建的Ionic项目中的所有npm包。
• 将ionic.config.json从Ionic项目复制到Angular项目。
• 将angular.json从Ionic项目复制到Angular项目。 如果您在angular.json中专门更改了任何内容，请在复制后在Angular项目中进行必要的更改。 Ionic默认使用SCSS作为样式表，因此如果您不使用SCSS，请确保在复制前从Angular项目的projects/app/architect/**/options/styles复制angular.json下的设置。
• 将package.json从Ionic项目复制到Angular项目。 如果您在package.json（npm脚本等）中专门更改了任何内容，请在复制后在Angular项目中进行必要的更改。 结合dependencies和devDependencies下两个项目设置的npm包。
• 如果您使用Git源代码控制，请合并两个项目中的.gitignore文件。
• 在Angular项目中，删除package-lock.json文件和node_modules文件夹。这些应位于项目的根目录中。
• 在Angular项目中，运行npm install命令。 npm install
• 测试并确保一切运行。

  // Test run with Ionic
  ionic serve
  // Test run with Angular
  ng serve --open

• 如果要为Cordova准备项目，请运行以下命令。请注意，需要环境设置。有关详细信息，请参阅参考部分。

  // For Android
  ionic cordova prepare android
  // For iOS
  //ionic cordova prepare ios