angularjs 1.3.x入门教程 1 环境安装
2014-11-19 20:12
309 查看
首先感谢网络上翻译angular 入门教程的先辈。
不过那个教程已经有点过时了。和GITHUB上的代码都匹配不上, 后来的学习者造会有很大障碍,这里通过学习顺便翻译一下上买你的东西,光是重点,套话就不翻译了
当你完成这个入门教程你应当可以
在所有的现代浏览器中创建一个动态应用
应用数据绑定从model写入view中
用Karma创建和运行UT
另外几项没翻译,今后不上,今天主要记录环境搭建的步骤和注意事项
1 安装GIT http://git-scm.com/download
2 安装nodejs
http://nodejs.org/download/.
3 克隆示例代码
注意,因为后面的一些npm操作需要很深的目录,建议这个clone操作在某个分区的根目录进行我用的是D盘根目录
进入git bash
不过那个教程已经有点过时了。和GITHUB上的代码都匹配不上, 后来的学习者造会有很大障碍,这里通过学习顺便翻译一下上买你的东西,光是重点,套话就不翻译了
PhoneCat Tutorial App 翻译(一)环境搭建
当你完成这个入门教程你应当可以在所有的现代浏览器中创建一个动态应用
应用数据绑定从model写入view中
用Karma创建和运行UT
另外几项没翻译,今后不上,今天主要记录环境搭建的步骤和注意事项
1 安装GIT http://git-scm.com/download
2 安装nodejs
http://nodejs.org/download/.
3 克隆示例代码
注意,因为后面的一些npm操作需要很深的目录,建议这个clone操作在某个分区的根目录进行我用的是D盘根目录
进入git bash
[code]git clone --depth=14 https://github.com/angular/angular-phonecat.git[/code] 克隆完毕之后,会在D 盘看到angular-phonecat文件夹
以下下操作都在git bash 中进行,不然会报错,因为windows 的文件路径长度支持优先,在安装npm 工具的时候会出现目录太深,文件名太长出错,PS 我开始在CMD 中运行NPM 导致了很多问题。
4 在GIT BASH 中进入angular-phonecat
cd angular-phonecat
5 运行命令 npm install 安装相关的依赖
安装完成之后,会在node_modules文件夹找到这些模块
Bower - client-side code package manager
Http-Server - simple local static web server
Karma - unit test runner
Protractor - end to end (E2E) test runner
npm
install 这个命令会用bower 自动下载angularjs框架到app/bower_components
文件夹
到这里,安装部分基本完成
6 验证安装
运行 npm start 然后再浏览器中访问[code]http://localhost:8000/app/index.html
可以看到界面就对了
7 运行 unittest
输入命令npm test,会弹出系统的默认浏览器,在git-bush中会出现如下界面,表示测试成功
8 运行端对端测试
运行命令 下载相关的依赖报[code]npm run update-webdriver
这个命令会到https://chromedriver.storage.googleapis.com/2.10/chromedriver_win32.zip 去下载这个zip,由于在这奇葩的国度,无法访问这个地址,所以这个命令会失败
挽救方法:
手动下载https://chromedriver.storage.googleapis.com/2.10/chromedriver_win32.zip 这个zip包,然后放到D:\angular-phonecat\node_modules\protractor\selenium目录中解压。
运行[code]npm run protractor
会看到如下console和chrome弹出来,然后运行一堆测试。
相关文章推荐
- 【OpenCV入门教程之一】 安装OpenCV:OpenCV 2.4.8或2.4.9 +VS 开发环境配置
- 【OpenCV入门教程之一】 安装OpenCV:OpenCV 3.0、OpenCV 2.4.8、OpenCV 2.4.9 +VS 开发环境配置
- 【OpenCV入门教程之一】 安装OpenCV:OpenCV 3.0 +VS 2013 开发环境配置
- 【OpenCV入门教程之一】 安装OpenCV:OpenCV 3.0、OpenCV 2.4.8、OpenCV 2.4.9 +VS 开发环境配置
- Unix/Linux环境C编程入门教程(6) 安装Fedora C/C++开发环境
- 【OpenCV入门教程之一】 安装OpenCV:OpenCV 3.0、OpenCV 2.4.8、OpenCV 2.4.9 +VS 开发环境配置
- Python入门教程之安装MyEclipse插件和安装Python环境
- angularjs 1.3.x入门教程 3 Angular Templates
- 【转】【OpenCV入门教程之一】 安装OpenCV:OpenCV 3.0、OpenCV 2.4.8、OpenCV 2.4.9 +VS 开发环境配置
- Unix/Linux环境C编程入门教程(11) 开发环境搭建VMWare虚拟安装之虚拟化检测
- swoole入门教程01-环境搭建及扩展安装
- 无废话MVC入门教程一[概述、环境安装、创建项目]
- 【OpenCV入门教程之一】 安装OpenCV:OpenCV 3.0、OpenCV 2.4.8、OpenCV 2.4.9 +VS 开发环境配置
- 无废话MVC入门教程一[概述、环境安装、创建项目]
- Unix/Linux环境C编程入门教程(11) 开发环境搭建VMWare虚拟安装之虚拟化检测
- Unix/Linux环境C编程入门教程(24) MySQL 5.7.4 for Red Hat Enterprise 7(RHEL7)的安装
- 【OpenCV入门教程之一】 安装OpenCV:OpenCV 2.4.8或OpenCV 2.4.9 +VS 开发环境配置
- golang入门教程(一) 安装和环境搭建
- 【OpenCV入门教程之一】 安装OpenCV:OpenCV 3.0、OpenCV 2.4.8、OpenCV 2.4.9 +VS 开发环境配置