前言
学习Angular也有一段时间了,一直没有认真写这一方面的博客,接下来利用空闲时间就把这一系列的内容好好串一串,总结一下。
这次的开发项目用到的版本是Angular4。
接下来就看看如何搭建Angular框架吧。
内容
搭建angular开发环境
- 安装Nodejs,
安装Nodejs就不详细解释了,直接官网下载安装就可以了。个人建议版本最好用稳定版。
安装好后在命令行中输入可以查看安装版本:npm -v
- 安装Angular CLI,
安装angular CLI命令:sudo npm install -g @angular/cli
(sudo指使用管理员权限)
angular CLI安装完成后查看版本号或者查看是否安装成功:ng -v
- WebStorm
安装WebStorm和安装Nodejs类似,下载下来直接安装即可。
- 创建项目
创建项目命令:ng new 项目名称
此时,Angular在当前目录生成对应项目名的项目,在 Visual Studio Code中可以打开生成的文件夹查看项目。
项目结构内容
e2e ------------------------------用于自动化测试
node_modules------------------存放依赖包的地方
src--------------------------------存放源代码
app----------------------------根模块
app.component.css------样式文件
app.component.html---模板
app.component.spec.ts-测试
app.component.ts-------组件
app.module.ts------------模块
environments----------------环境
environment.prod.ts----生产环境
environment.ts----------非生产环境
index.html-------------------宿主页面
mian.ts-----------------------程序引导
tsconfig.json-----------------编译配置
angular-cli.json--------------angular-cli配置
package.json----------------依赖包以及npm的命令