ionic4指北

前言

• ionic4在2019年初发布，距离现在已经有一段时间了。由于各种原因，我最近才开始入门ionic4，目前我在github上已经建了一个ionic4开发模版项目，正在不断完善
• ionic4明显比ionic3快了，angular7也比angular4更易用，打算就用i4开发app了

关于ionic4

• ionic3对angular封装的比较多，以至于会用i3开发app，却不会用angular开发web项目；ionic4把重心放在ui工作上，它现在可以称为ui框架，js框架你可以选择angular/vue/react，如果你继续使用angular做js框架，i4项目完全就是一个angular项目，如果你也用angular做web项目，那几乎是零学习成本就上手了，i4项目结构和angular web项目是一样的

ionic4相比ionic3变化大吗？

• 可以说大也可以说不大，上面说了ionic4可以用vue，react做js框架，如下图，每个ui组件提供了3种使用方式，如果你继续使用angular作为js框架，那变化不大，会i3上手i4很快，ionic对vue和react的支持目前（2019年3月20日）还没有发布稳定版，不过我这里继续选用angular做为js框架，web端使用NG-ZORRO做ui框架
  
  

ionic4+angular开发app项目项目ionic3有哪些变化？

• 项目结构和angular项目保持一致，所以也可以使用angular cli
• 路由与导航变化，i3封装的路由相比angular默认的路由好用，现在统一为angular路由，angular的路由配置刚开始上手确实挺复杂的，各位可以看这篇ionic4/angular路由配置与导航传参
• 为了更好的性能，i4许多ui组件用异步方式创建。如Alert、Modal、ActionSheet、Popover等，使用时要注意：组件还没打开又调用了关闭方法；打开第二个alert可能第一个alert还没打开；处理android返回按钮事件关闭alert，等都要考虑异步问题
• 还有的变化可能就是angular4到angular7的变化了。比如Service类不用在app.module.ts文件中的providers中声明了，cordova插件还是要的，否则使用--prod参数打包失败
• 关于插件调用及使用方式基本没变化，只不过更新了插件依赖包文件，如下图/ngx是新的依赖包路径
  
  

开发建议

• 认真通读ionic官网文档和angular官方文档，可能很多你头疼的问题就是少了一个配置，原因是你没读官方文档，不知道有这项配置
• 关注官网github的更新，很多问题你解决不了，可能升级一下版本就ok了
• 我在这里更新了学习指引链接，建议各位保存书签方便查看https://www.jianshu.com/p/7d1577539183

环境配置

• 使用ionic4开发app，建议nodejs、ionic cli、cordova、项目中的依赖等环境均用最新版；npm install -g ionic cordova @angular/cli
• 如果需要维护旧版本项目建议使用nvm管理多个环境配置

其他

• ionic官网还给出了PWA和Electron桌面应用文档，虽然以前也可以做PWA和桌面应用，不过现在感觉更稳了