ionic-环境搭建-入门

Posted 2021-03-24 zd-blogs

环境搭建

1、官方推荐：
npm install -g cordova ionic
使用npm国内安装小坑，下载慢，还是失败

2、先安装cnpm，使用淘宝镜像；:
npm install -g cnpm --registry=https://registry.npm.taobao.org

3、使用cnpm安装cordova和ionic：
cnpm install -g cordova ionic

4、更新：
cnpm update -g cordova ionic

5、更新已建ionic项目中的js类库，命令行中先进入项目所在目录，然后运行：
ionic lib update

6、配置android环境：
ANDROID_HOME = 你放置android_sdk的文件夹路径
path = %ANDROID_HOME%platform-tools;
path = %ANDROID_HOME% ools;

7、安装 Angular CLI：
cnpm install -g @angular/cli

8、打包时还会使用gradle：
下载地址:
http://services.gradle.org/distributions/
安装教程：
https://www.cnblogs.com/linkstar/p/7899191.html

入门

1、创建项目：
进入到你要创建项目的路径，如 C:homeionic
创建一个 tabs的项目
格式如下 ionic start
创建tab模板项目：
ionic start myApp tabs

2、添加android平台
cd 进入项目目录，执行命令：
ionic cordova platform add android

3、安装依赖
cnpm i

3、生成android apk:
ionic cordova build android

4、在android模拟器或真机中模拟:
ionic cordova emulate android

6、可以将上面两步合并成一个步骤如下
ionic cordova run android

7、 坑：
正常创建一个简单项目blank，在手机上调试，启动后项目一直白屏，修改项目src下index.html

<base href="/" />
改为：
<base href="." />