搭建Cordova + Ionic + WebStorm环境开发Web App应用

骑猪看日落 2022-03-20 10:28 257阅读 0赞

# #

1. 下载并且安装node.js（https://nodejs.org/en/）  
  
  
2. 打开终端，安装cordova (如果安装失败或者卡住不动则重新安装)  
    sudo npm install -g cordova

如果一直安装不上有可能是镜像问题，改用国内镜像，在终端执行如下命令再次安装：

npm config set registry http://registry.cnpmjs.org npm info underscore

3. 安装ionic  
    sudo npm install -g ionic  
  
  
4. 如果要调用xcode模拟器则要安装插件  
    sudo npm install -g ios-sim  
  
  
5. 创建项目   
  
   1> cd到要创建项目的路径   
   2> ionic start myproject          //  myproject为你要创建的项目名称 （如果不成功或者卡住则重新创建）  
   3> cd myproject                     //  创建成功则进入到项目里面  
   4> ionic platform add ios       //  添加ios平台，如果是android平台则是：ionic platform add android  
   5> ionic build ios                   //  编译ios项目，如果是android平台则是：ionic build android  
   6> ionic emulate ios              //  模拟器启动项目，如果是android平台则是：ionic emulate android  
   7> ionic run ios                     //  真机运行  
   8> ionic serve                       //  浏览器调试  
  
  
6. 如果使用命令ionic emulate ios 后模拟器跑不起来，可以直接到项目里面：platforms文件夹下的ios文件夹里直接运行项目到xcode上  
  
  
7. 下载安装WebStorm，打开WebStorm会提示要安装java环境JDK 根据提示下载安装好  
  
  
8. WebStorm新建项目：File -> New Project -> 选中PhoneGap/Cordova App  
  
  
9. 运行项目：Edit Configurations里可配置项目保存路径，运行在哪个平台等