(一)下载安装node.js
环境变量会自动配置,用path命令检查
node -v,npm -v检验是否安装成功
(二)全局安装Angular cli
用管理员权限打开命令行
//可在C:/windows/system32下打开
npm install -g @angular/cli
(三)下载、安装、破解webstorm
破解:安装完成后,License-Activaction窗口选择Licenseserver.输入网址:http://idea.iteblog.com/key.php
即可破解
也可搭建本地服务器,这样的话IntellJIdea公司的软件都可破解,而且不受网络服务器的影响。
本地服务器下载地址
(四)构建项目
- 打开终端命令行,到要创建项目的目录下
ng new bond//需要较长时间,大部分时间在安装npm包
- 启动服务器
ng server --open//--open会自动打开localhost:4200网页
- 使用webstorm 创建angularjs项目
file->setting->keymap(可修改webstorm的快捷方式为eclipse的快捷方式)
- 打开服务器
打开网页:localhost:4200
4200是默认的端口号,如果要更改,需要修改package.json文件为
ng serve –host localhost –port 4201
项目介绍
通过上述方法生成了AngularJS项目,应用代码位于src文件夹下,所有的Angular组件、模板、图片以及你的应用所需的任何东西都在那里。这个文件夹之外的文件都是为构建应用提供支持用的。
还有一些图中没有标明的文件,如下表
文件File | 用途Purpose |
---|---|
.angular-cli.json | Angular CLI的配置文件。在这个文件中,我们可以设置一系列的默认值,还可以配置项目编译时要包含的那些文件。 |
.editorconfig | 给你的编辑器一个简单配置文件,用来确保参与你项目的每个人都具有基本的编辑器配置。 |
.gitignore | 一个Git的配置文件,用来确保某些自动生成的文件不会被提交到源码控制系统中。 |
karma.conf.js | 给Karma的单元测试配置,当运行ng test时会用到它。 |
package.json | npm配置文件,其中列出了项目使用到的第三方依赖包。你还可以在这里添加自己的自定义脚本。 |
protractor.conf.js | 给Protractor使用的端到端测试配置文件,当运行ng e2e的时候会用到。 |
README.md | 项目的基础文档,预先写入了CLI命令的信息,别忘了用项目文档改进它,以便每个查看此仓库的人都能据此构建出你的应用。 |
tsconfig.json | TypeScript编译器的配置,你的IDE会借助它来给你提供更好的帮助。 |
tslint.json | 给TSLint和Codelyzer用的配置信息,当运行ng lint时会用到。Lint功能可以帮你保持代码风格的统一。 |