如何在Windows下使用ionic打包与开发IOS程序

在Windows下使用ionic打包与开发IOS程序

ionic开发Android程序都不需要安装eclipse等IDE，只要一个能写SSS，JS ，HTML的IDE就行（Hbuilder，WebStrom，Sublime Text）， 开发完成之后不就执行个ionic platform add android,ionic build android，然后就能生成一个.apk文件，给手机上一安装O了。

安装ionic开发环境（这个和在windows上安装android开发环境类似）。

安装Nodejs，按照步骤下载安装即可。

安装cordova，ionic，sudo npm install -g cordova ，sudo npm install -g ionic 或者合成一句统一安装sudo npm install -g cordova ionic。

创建项目，cd firstIonicProjectForIosionic serve(自动在afai浏览器中打开)浏览器中运行项目（调试项目）。

模拟器中运行项目

因为apple开发的证书限制我们在没有申请购买apple账号的情况下，使用虚拟机来部署我们的应用，在部署之前需要使用npm安装一个ios-sim插件用来调用模拟器。

用Ionic来开发app的很可能对Ios和android的app打包。

开发iOS程序需要mac本，没的话就只能在虚拟机上安装一个MacOS。ionic开发ios程序就得安装Xcode IDE，这个ipa文件不能被直接安装到苹果上，只能先上传到APP Store，人家审核通过之后，我们再从APP Store上下载。

官方文档： Installing Ionic - Ionic Documentation

1.删除旧版本ionic

npm uninstall -g ionic

2.安装新版本

npm install -g @ionic/cli

值得注意的是，ionic的资源包变为了ionic/cli

在cmd或终端进入合适的目录，然后运行命令：

ionic start 项目名称 tabs

然后选择项目类型（Angular、React、Vue），这里选择的是Angular，回车

大概意思是是否集成capacitor，这里暂时先选NO，等待安装node_modules

是否创建ionic账号，选择NO，项目创建完成，然后进入创建的项目目录下，输入命令启动服务：

ionic serve  

启动成功！

3-1-1 添加安卓平台

ionic capacitor add android

没有www文件。尝试运行一下ionic build，然后再次运行添加平台命令，项目中多了android文件夹

因为官方并没有提供直接打包的命令，需要借助android studio来打开安卓项目，在项目中运行命令：

npx cap open android

这样直接启动android studio并打开该安卓项目

对于android studio的安装和android_SDK以及安卓模拟器的配置可以自行了解学习一下，我这里是已经搭建好的安卓开发环境。

点击运行按钮，就可以在模拟器上运行该程序

每次对ionic项目做更改需要把这些更新同步到安卓项目中，需要运行命令：

ionic capacitor copy android

3-1-2 添加iOS平台

在项目目录下运行命令： 

ionic capacitor add ios

报错了，大概是因为cocoapos没有安装或者版本过低，尝试更新一下cocoapos

打开终端，输入sudo gem install cocoapods来升级CocoaPods；

如果遇到

ERROR: While executing gem ... (Gem::FilePermissionError)

You don't have write permissions for the /usr/bin directory.

这个错误的话就改用sudo gem install cocoapods -n /usr/local/bin命令即可。

接下来删除ios文件夹，重新添加ios平台，

根据提示，用xcode打开该ios项目

npx cap open ios

点击运行按钮，在iOS模拟器上查看效果

使用cordova添加平台和以前的ionic版本是一样的，首先尝试添加一下android平台:

ionic cordova platform add android

发现报错了，提示在capacitor的项目中不可以使用cordova，如果使用cordova需要禁用capacitor：

ionic integrations disable capacitor

禁用成功。

再次添加安卓平台，提示是否集成cordova，输入y

然后又又又报错了。

这是什么鬼，以前用cordova添加平台没有遇见过，我猜测可能是跟capacitor添加的android文件冲突，于是删除android文件夹再试一次。

果然添加成功！

再尝试一下cordova能不能打包成功:

ionic cordova build android

打包也成功了。

接着又尝试了一下用cordova添加和打包iOS，跟处理android平台的方式一样，先把ios文件夹删除，再进行添加和打包 *** 作，都成功了。

事实证明，新版的ionic版本既可以集成最新的capacitor，也兼容集成cordova。

ionic 是一个专注于用WEB开发技术，基于HTML5创建类似于手机平台原生应用的一个开发框架。绑定了与AngularJS和Sass。这个框架的目的是从web的角度开发手机应用，基于PhoneGap的编译平台，可以实现编译成各个平台的应用程序。

ionic的开发添加android和ios环境。

ionic提供很多css组件 和javascript UI库。

ionic可以支持定制android和ios的插件，也支持服务端REST的敏捷开发

END

ionic安装

1

将cordova和ionic包安装到全局环境中（可供命令行使用）

2

安装完成之后，进入你要创建项目的路径，就可以使用ionic创建项目了

END

启动

1

然后可以使用：ionic serve

该命令会自动启动流浏览器，查看当前效果。

模板效果

空白模板（Black app）

$ ionic start myApp blank

tabs模板

$ ionic start myApp tabs

3

sidemenu模板

$ ionic start myApp sidemenu

---