node.js yeoman grunt 快速构建项目

1. node.js 安装

2. yeoman grunt安装

npm install -g bower
npm install --global yo
npm install -g grunt-cli
yo --version && bower --version && grunt --version
npm install -g generator-angular@0.7.1

3. 创建项目 安装bower、node、grunt

$ cd d:
$ mkdir myApp
$ cd mytodo
$ yo angular
# 报错少 grunt-contrib-imagemin
# 安装 grunt-contrib-imagemin
$ npm install grunt-contrib-imagemin --save-dev

$ npm install
$ bower install
$ npm install grunt --save-dev
# 初步这样也就行了,但是/bower_components这个目录有点让人不习惯,我想把东西下载到我习惯的目录里。需要加一个.bowerrc文件。注意,不需要名字什么的,只要新增一个.bowerrc就行了。

cordova 快速构建 ios、andriod、browser 项目app

1.安装Cordova

# Cordova的命令行运行在Node.js 上面并且可以通过NPM安装。 根据 平台具体指导 安装相应平台的依赖。打开命令提示符或终端,然后键入npm install -g cordova.
$ npm install -g cordova

2. 创建一个项目

#使用命令行创建一个空的Cordova项目。导航到你希望创建项目的目录,然后键入 cordova create <path>。
#要知道这个命令完整的选项,键入cordova help create。
$ cordova create MyApp

3. 添加一个平台

# 在创建完一个Cordova项目后,导航到项目目录。在项目目录中,你需要添加你想构建app的平台
# 为了添加平台, 键入 cordova platform add <platform name>。
# 为了知道你可以添加的平台,你可以运行cordova platform。
$ cd MyApp 
# browser andriod ios
$ cordova platform add browser
# $ cordova platform remove android

4.运行App

#在命令中,键入cordova run <platform name>。
# browser andriod ios
$ cordova run browser

5、开发完成后,使用cordova 打包项目成目标平台的应用

# 
$ cordova build android

6、进行仿真模拟器

# 
$ cordova emulate android

7. 添加插件

可以用CLI搜索可用的插件:

cordova plugin search bar code

安装插件,比如:

cordova plugin add org.apache.cordova.device                   //设备API

cordova plugin add org.apache.cordova.network-information  //网络(事件)

cordova plugin add org.apache.cordova.battery-status      //电池(事件)

cordova plugin add org.apache.cordova.device-motion     //加速器

cordova plugin add org.apache.cordova.device-orientation     //罗盘

cordova plugin add org.apache.cordova.geolocation         //定位

cordova plugin add org.apache.cordova.camera                 //摄像头

cordova plugin add org.apache.cordova.media-capture     //媒体文件处理

cordova plugin add org.apache.cordova.media                   //媒体文件处理

cordova plugin add org.apache.cordova.file                        //文件访问

cordova plugin add org.apache.cordova.file-transfer          //文件传输

cordova plugin add org.apache.cordova.dialogs                 //对话框

cordova plugin add org.apache.cordova.vibration              //震动

cordova plugin add org.apache.cordova.contacts               //联系人

cordova plugin add org.apache.cordova.globalization       //全球化

cordova plugin add org.apache.cordova.splashscreen       //闪屏

cordova plugin add org.apache.cordova.inappbrowser             //打开新的浏览器窗口

cordova plugin add org.apache.cordova.console                //调试控制台

你可以用以下命令查看所有已经安装的插件

cordova plugin ls

使用以下命令删除插件:

cordova plugin rm org.apache.cordova.console

或者通过地址来添加插件:

cordova plugin add https://github.com/apache/cordova-plugin-console.git

Android SDK

Android SDK的国内镜像服务器来下载安装,这里推荐几个:

1、中科院开源协会镜像站地址:

IPV4/IPV6 : http://mirrors.opencas.ac.cn 端口:80

2、北京化工大学镜像服务器地址:

IPv4: http://ubuntu.buct.edu.cn/ 端口:80

IPv4: http://ubuntu.buct.cn/ 端口:80

IPv6: http://ubuntu.buct6.edu.cn/ 端口:80

3、大连东软信息学院镜像服务器地址:
http://mirrors.neusoft.edu.cn 端口:80

ionic

# 更新 cordova ionic
# npm update -g cordova ionic
$ npm install -g ionic
$ ionic start myApp tabs
# demo
$ ionic start myproject --type ionic1
# 启动
$ ionic serve
# 启动 指定IP地址
$ ionic serve --address 192.168.20.45

1.创建Android应用

#
$ cd myApp
$ ionic platform add android
$ ionic build android
$ ionic emulate android

2.创建iOS应用

#
$ cd myApp
$ ionic platform add ios
$ ionic build ios
$ ionic emulate ios

3. 启动

#
$ ionic serve

通过Ionic创建一个项目

使用Ionic官方提供的现成的应用程序模板,或一个空白的项目创建一个Ionic应用。

ionic start myApp blank  创建一个空白的app项目 

ionic start myApp tabs 创建一个带有tabs项目

ionic start myApp sidemenu 创建一个带有滑动的项目

如果出现”ios-sim was not found.”错误,可以执行以下命令:

npm install -g ios-sim