AngularJS初探:搭建PhoneCat项目的开发与测试环境
AngularJS官方网站提供了一个用于学习的示例项目:PhoneCat。这是一个Web应用,用户可以浏览一些Android手机,了解它们的详细信息,并进行搜索和排序操作。
对于PhoneCat项目的开发环境和测试环境的搭建,官方网站上提供了详细的指导:http://docs.angularjs.org/tutorial。
获取源代码
PhoneCat项目的源代码托管在GitHub上,因此获取源代码之前需要安装Git (http://git-scm.com/download)。安装Git后,可以通过git clone来下载源代码:
git clone --depth=14 https://github.com/angular/angular-phonecat.git
–depth=14选项的意思为:仅下载最近14次的代码提交版本;这么做可以减少下载的文件大小,加快下载。
安装依赖包
PhoneCat是一个Web应用程序,因此最好在Web服务器中运行,以期获得最佳结果。官方推荐安装Node.js (http://nodejs.org/download/)。
PhoneCat项目的运行与测试依赖一些别的工具,可以在安装Node.js后通过npm命令来安装这些依赖包。以下命令需在angular-phonecat项目路径下运行:
npm install
运行该命令后,会在angular-phonecat项目路径下安装以下依赖包:
- Bower. 包管理器
- Http-Server. 轻量级Web服务器
- Karma. 用于运行单元测试
- Protractor. 用于运行端到端测试
运行PhoneCat项目
完成上述工作后,运行PhoneCat项目很简单,在angular-phonecat项目路径下运行以下命令即可:
npm start
PhoneCat运行后,可以在浏览器中打开http://localhost:8000/app/index.html来访问该Web应用。
运行单元测试
PhoneCat项目中的单元测试是使用Karma来完成的,所有的单元测试用例都存放在test/unit目录下。可以通过执行以下命令来运行单元测试:
npm test
值得一提的是,在运行单元测试前,计算机上必须安装Google Chrome浏览器。
运行端到端测试
PhoneCat项目使用端到端测试来保证Web应用的可操作性,而这个端到端测试是通过使用Protractor来实现的,所有的端到端测试用例都存放在test/e2e目录下。可以通过执行以下步骤来运行端到端测试:
//更新webdriver,此命令只需运行一次
npm run update-webdriver
//运行PhoneCat
npm start
打开另一个命令行窗口,在其中运行:
npm run protractor
AngularJS初探:搭建PhoneCat项目的开发与测试环境的更多相关文章
- 搭建PhoneCat项目的开发与测试环境
		AngularJS官方网站提供了一个用于学习的示例项目:PhoneCat.这是一个Web应用,用户可以浏览一些Android手机,了解它们的详细信息,并进行搜索和排序操作. 获取源代码 PhoneCa ... 
- (B)springboot配置开发和测试环境并添加启动路径
		嗯,开发和测试环境要分离,这是一般共识(虽然我工作过的公司都没有这种分离),spring boot也可以按照配置文件的读取来做到这一点. 上图有三个application开头的配置文件,要达到能够读取 ... 
- ios-实现项目在开发、测试、正式环境快速部署
		快速部署:简单的来说,就是不用更改开发.测试.正式环境下的 url ,来实现在同一台测试手机快速部署三种项目状态. Bundle ID一样只会出现一个app:不一样会出现三个app: 具体步骤: 一. ... 
- 区块链入门(1):搭建(Ubuntu系统)Truffle v3.2.1 开发和测试环境
		本文主要讲解ubuntu 16.04下, truffle开发测试环境的搭建. 第一步:安装nodejs 和 npm,有两种比较常见的方法. 方法1:直接在nodejs官网下载nodejs-v6.10 ... 
- 使用Vagrant部署虚拟分布式开发和测试环境
		同步更新到笔者个人博客,可以访问我的博客查看原文:https://www.rockysky.tech 创建自动化配置开发环境 最近由于最近研究和学习的关系,需要经常配置和搭建多个虚拟机组成的分布式系统 ... 
- 【转】MEAN:Nodejs+express+angularjs+mongodb搭建前端项目框架NJBlog
		http://www.cnblogs.com/mz121star/archive/2013/03/13/njblog.html 项目地址:https://github.com/mz121star/ ... 
- Windows下mock环境搭建-加速项目Api开发
		本文来自http://blog.csdn.net/liuxian13183/ ,引用必须注明出处! 公司进行技术部拆分,以项目制作为新的开发模式,前端+移动端+后端,于是加速Api开发变得很有必要,准 ... 
- https://www.cnblogs.com/beileixinqing/p/7724779.html   vue-cli生成的项目配置开发和生产环境不同的接口 vue-cli生成的项目,vue项目配置了不同开发环境的接口地址,axios.defaults.baseURL如何引用这个地址,这是在我发布项目的时候考虑的,于是想到了
		方法二:(集热心网友提供的方案) 一般项目webpack会有两个或多个配置文件,如: webpack.prod.conf.js 对应线上打包 webpack.dev.conf.js 对应开发环境 使用 ... 
- vue-cli生成的项目配置开发和生产环境不同的接口
		vue-cli生成的项目,vue项目配置了不同开发环境的接口地址,axios.defaults.baseURL如何引用这个地址,这是在我发布项目的时候考虑的,于是想到了 方法一: config下配置文 ... 
随机推荐
- django post报403问题
			第一个问题是: 我使用jquery的ajax向后台传值, 当使用GET方法时没问题 $.ajax({ type:"GET" url: data: success: }) 但是由于基 ... 
- IO流的异常处理
			在IO流的异常处理时应该注意以下几点: 1.在外边建立引用,在Try内进行初始化(FileWriter fw = null;) 2.文件的路径使用必须是双斜杠,转义(fw = new FileWrit ... 
- MySQL监控工具-orzdba
			源代码地址:http://code.taobao.org/p/orzdba/src/trunk/ [root@hank-yoon servers]# chmod +x orzdba 在代码的1 ... 
- Seafile V4.1 安装笔记
			yum -y install gcc gcc-c++ make cmake pcre pcre-devel expat expat-devel curl wget mlocate gd gd-deve ... 
- 【css老版本浏览器兼容利器】ie-css3.htc
			做前端的同学都应该听说或者用过,是一段脚本,可以让ie实现css3里的圆角和阴影效果. css带来的便利是很容易感受的到的,但恶心的是它在ie下的不兼容,所以某位牛人现身写了个ie-css3.htc, ... 
- 二、有限状态机(FSM)
			1.状态机的作用?是什么? 状态机,顾名思义就是用来描述状态的.完善一点就是在同一的时钟下.更准确说是一种verilogHDL编程思想. 例如我们每一个系统都可以分为好几种状态,如:开始,初始化,运行 ... 
- Notes of the scrum meeting(10/31)
			meeting time:3:00~4:30p.m.,October 30th,2013 meeting place:绿园 attendees: 顾育豪 ... 
- 2436: [Noi2011]Noi嘉年华 - BZOJ
			Description NOI2011 在吉林大学开始啦!为了迎接来自全国各地最优秀的信息学选手,吉林大学决定举办两场盛大的 NOI 嘉年华活动,分在两个不同的地点举办.每个嘉年华可能包含很多个活动, ... 
- Objective-C传递数据小技巧
			转自:http://www.guokr.com/blog/203413/ 比如说,如果你想向UIAlertView的delegate方法中传递一些信息,怎么办?继承UIAlertView么?使用Cat ... 
- 查看系统网络连接打开端口、系统进程、DOS打开文件
			问题描述: DOS查看系统网络连接打开端口.打开的服务 问题解决: (1)DOS查看系统网络连接打开端口 注: 使用 netstat 命令,可以查看系统打开的端口 (2)查看和关闭系统打开进程 ... 
