博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
angular-seed — AngularJS种子项目
阅读量:6264 次
发布时间:2019-06-22

本文共 2400 字,大约阅读时间需要 8 分钟。

 

AngularJS Seed 是典型 AngularJS web 应用的应用骨架,可以快速启动你的 AngularJS webapp 项目和这些项目的开发环境。

AngularJS Seed 包括一个示例 AngularJS 应用,预配置安装 Angular 框架,为满足即时 Web 开发提供一些开发和测试工具。

Seed 应用只是展示如何连接两个控制器和视图。。


开始

准备条件

你需要先用 git 将克隆到自己的本地,然后安装它的依赖。

如果你没有安装过git,你可已再 获取他。

当然我们还需要用node.js来初始化和测试angular-seed,如果你没有安装node.js及相应的NPM,你可以从获取它。

克隆 angular-seed

使用git克隆 angular-seed,并进入 angular-seed目录

  1. git clone https://github.com/angular/angular-seed.git
  2. cd angular-seed

如果你想获取没有历史commit的Angular-seed源码,请使用

  1. git clone --depth=1 https://github.com/angular/angular-seed.git <your-project-name>

安装依赖

angular-seed已经预先设定npm去自动运行bower,所以我们能这样简单运行:

  1. npm install

后面的场景,也将调用bower install。安装后,你能发现有两个新文件夹在你的项目中。

  • node_modules - 包含我们需要的npm工具包。
  • app/bower_components - 包含angular的框架文件。

运行项目

angular-seed已经预先项目带有一个简单的开发Web服务器,我们可以很简单的启动它。

  1. npm start

在浏览器中访问应用程序,。

目录结构

  1. app/-->项目的源文件
  2. app.css -->默认的css文件
  3. components/-->所有应用程序的特定模块
  4. version/-->相关的组件
  5. version.js -->基本模块的声明
  6. version_test.js -->基本模块的测试
  7. version-directive.js -->用户定义的指令
  8. version-directive_test.js -->用户定义的指令测试
  9. interpolate-filter.js -->用户定义的过滤器
  10. interpolate-filter_test.js -->用户定义的过滤器测试
  11. view1/--> view1视图模板和控制器
  12. view1.html -->局部模板
  13. view1.js -->控制器
  14. view1_test.js -->控制器的测试
  15. view2/--> view2视图模板和控制器
  16. view2.html -->局部模板
  17. view2.js -->控制器
  18. view2_test.js -->控制器的测试
  19. app.js -->主项目模块
  20. index.html -->项目布局模板
  21. index-async.html -->就像index.html,但异步加载JS文件
  22. karma.conf.js -->用于运行karma单元测试的配置文件
  23. e2e-tests/-->端对端测试
  24. protractor-conf.js -->Protractor配置文件
  25. scenarios.js -->Protractor端对端测试的运行文件

测试

有两种测试,单元测试和端对端测试。

运行单元测试

angular-seed预先配置了单元测试。它们是Jasmine写的,我们使用 Karma测试运行器运行它。有一个默认的 Karma文件去运行它。

  • 你能在karma.conf.js查看单元测试配置。
  • 每个运行的代码下有它对应的单元测试代码,并命名为..._test.js

最简单的运行单元测试,使用以下脚本:

  1. npm test

这句命令将启动 Karma来执行单元测试。而且, Karma会监控代码和测试文件的变化,并重新运行单元测试。但每次更改都运行单元测试,可能会打破你预期的代码功能。

你也可以叫Karma运行简单的单元测试后就退出。这样可有效的检验一个特定版本的代码是否是按预期运行的。使用下面的脚本:

  1. npm run test-single-run

端对端测试

angular-seed预先配置的端对端测试是用 Jasmine写的,用 Protractor端对端测试器运行它。它使用本地事件,并对angular应用具有特殊功能。

  • 你能在e2e-tests/protractor-conf.js查看端对端测试配置。
  • 运行e2e-tests/scenarios.js进行端对端测试。

Protractor模拟与我们的Web应用程序的交互并且验证应用程序是否正确响应。所以,我们的web服务器必须能被应用程序正常的打开,以便Protractor能与它互动。使用下面的脚本:

  1. npm start

运行Protractor需要先安装 WebDriver,angular-seed使用以下代码安装它:

  1. npm run update-webdriver

这句脚本将会下载并安装最新的独立的WebDriver工具。

确保你的web服务器环境运行起来了,并且 WebDriver已经更新过了,你可以进行端对端测试了,运行以下代码:

  1. npm run protractor

提醒: Protractor使用,这需要你的本地机器安装了。在命令行输入 java -version检查下JDK是否安装。

若没安装,你可以点击下载它。

转载于:https://www.cnblogs.com/muxueyuan/p/7028132.html

你可能感兴趣的文章
在FMOD中使用customRollOff实现更自然的声音衰减
查看>>
java日常-map转成json
查看>>
动画view
查看>>
自己写个多任务多线程断点下载框架
查看>>
Css 按钮
查看>>
Silverlight显示WCF详细异常信息
查看>>
BZOJ5299:[CQOI2018]解锁屏幕(状压DP)
查看>>
BZOJ1042:[HAOI2008]硬币购物(DP,容斥)
查看>>
[项目管理]关于项目的工期控制
查看>>
hdu3976(Electric resistance) 高斯消元
查看>>
重启eclipse color theme失效的解决办法
查看>>
使用腾讯云COS与CDN提示跨域的解决方案
查看>>
openwrt的自动挂载功能
查看>>
C# 委托链、多路广播委托
查看>>
使用ADO.NET DbContext Generator出现错误—Unable to locate file
查看>>
以下是大数人K站的原因,N个站的总结经验。
查看>>
《失业的程序员》(八):创业的要素
查看>>
ASP.net 连接 Lotus Domino ,在VS中可以正常,放到IIS中不能正常运行。
查看>>
Hibernate总结--MyEclipse的小bug
查看>>
PHP 附近的人
查看>>