Angular开发环境搭建

1、安装NODEJS

(1) nodejs程序下载
从http://nodejs.cn/download/ ,根据自己的操作系统,选择对应的版本。

Angular开发环境搭建_第1张图片
image.png

(2) nodejs安装
安装过程,按照引导程序,一步一步走下去即可。
(3)nodejs验证
在命令行输入 node -v,显示正确的版本,表示安装成功。
Angular开发环境搭建_第2张图片
image.png

2、安装Python

(1) python程序下载
从 https://www.python.org/downloads/release/python-2713/ ,根据自己的操作系统,选择对应的版本。
(2)python程序安装
安装目录选择 C:\Python27 目录。

3、安装Angular-cli

(1)安装Angular-cli

npm install -g @angular/cli

(2)验证Angular-cli

ng -v
Angular开发环境搭建_第3张图片
image.png

4、创建一个项目

//lzf 项目名称
ng new lzf
Angular开发环境搭建_第4张图片
image.png

5、启动项目

进入项目目录,运行如下命令

npm start

运行结果:

Angular开发环境搭建_第5张图片
image.png

浏览器访问
http://127.0.0.1:4200
Angular开发环境搭建_第6张图片
image.png

6、打包项目

执行命令:

ng build

运行结果:

Angular开发环境搭建_第7张图片
image.png

输出文件:
输出文件在项目的dist目录中。
Angular开发环境搭建_第8张图片
image.png

7、独立部署

将打包的向, 拷贝到nginx 或者tomcat 或者其他服务器,可以独立的部署。在index.html 中的base 标签,修改项目的根路径。

  

你可能感兴趣的:(Angular开发环境搭建)