VSCode扩展
- vscode-icons
用于项目中文件类型显示对应的图标，提高文件定位的效率 - TSLint
the linter for the TypeScript language - Path Intellisense
用于提示导入文件时候的路径 - ESLint
JS代码的规范检测 - beautify
进行代码的格式自动美化 - Project Manager
项目管理 - Bracket Pair Colorizer
括号增强功能 - Document This
生成注释的VSCode插件
Android开发环境安装
- Android Studio 版本2.3.3
- Standalone SDK Manager
- 用于管理与更新本地的SDK
- 需要自己解决网络的问题
- /Users/YourAccount/Library/Android/sdk/tools MAC平台路径
- C:\Productivity\android-sdks\tools Windows平台的路径
Android模拟器GenyMotion安装
免费的，去官网注册一下就可以
Xcode简介与使用注意点
IOS平台的开发打包工具
- 只可以在Mac平台下使用
- 如果你需要打包发布（指发布到AppStore），系统和Xcode就不要安装beta版本
- 注意目录的权限问题 chmod -R 777
Ionic 使用的TypeScript语言
V2.3之前使用的是javascript，V2.3之后使用的是typescript
开发环境初始化
- 使用Ionic CLI进行项目的初始化构建
初始化命令行
1. install ionic
npm install -g cordova ionic
2. start an app
ionic start myApp tabs
3. run your app
cd myApp
ionic serve
4. supercharge your app
ionic link
建议使用tabs进行项目的初始化
--type ionic1
注意是ionic serve 不是ionic server
market.ionic.io/starters/
- Ionic CLI初始化失败时的另一种构建项目方案
确认安装了ionic环境
下载文件夹
直接启动
- VSCode打开项目插件初始化
- 编译项目的方法并在IOS环境下体验
sudo ionic cordova platform ls 会列出当前已有哪些平台
sudo ionic cordova platform ios
注意获取目录权限的问题
sudo chmod -R 777 项目文件夹名
真机调试与发布需要Apple开发者账号
IOS9及以后版本，开发与测试不需要付费苹果开发者账号
- 编译项目的方法并在Android环境下体验
ionic cordova platform ls
ionic cordova platform add android
可能会出错，墙的原因，官方解决方案：
npm install -g @ionic/cli-plugin-proxy
sudo chmod -R 777 项目文件名
windows下用管理员身份运行
项目打开后的构建也可能遇到网络的问题
直接使用android studio进行连接调试
打包成apk拖入后进行测试
支持的版本
- 编译项目的方法并在浏览器环境下体验
后面的开发、调试都在浏览器下进行
8100端口占用的问题
- 编译项目的方法并在微信环境下体验
ionic cordova platform add browser
为后期微信发布做准备
注意微信的标题title问题
ionic cordova build browser
部署platform/browser/www文件夹到对应的服务器，其实就是一个静态站点的部署过程
