Angular安装以及项目客户端搭建

Angular安装以及项目客户端搭建

先说说前提，然后在讲具体的。最近有个项目前段用到了AngularJs、less、typescript、ng-zorro，所以要搭建一个客户端启动环境，这里选择nodeJs然后在配上visual studio code。安装教程如下：

一：先安装NodeJs

ps：下载链接：http://nodejs.cn/download/

安装步骤就是一直next，一直点

注意事项：安装完毕后环境变量其实都不用配（不信你cmd命令测试：node -v 和npm -v），在安装的时候已经配好了，卸载nodejs的时候它也会自动把配置的环境变量删除，nodejs这个优化很棒。 新版的nodejs安装带有npm，所以不用再下载npm管理了。（很多教程都喜欢更改nodejs的缓存cache和全局变量glob，最好不要改配置，默认即可）

 

二：安装Angular（注意要先安装typescript和typings）

1.cmd管理员身份打开命令行窗口，配置淘宝镜像（这样下载东西就是从国内网站下载了，网速更快）。

命令：npm config set registry  https://registry.npm.taobao.org

 

2.安装less（我项目里用到了less，所以安装，没用到的可以不安装）

命令：npm install -g less

 

3.安装typescript和typings

命令：npm install -g typescript typings

 

4.安装angular

命令：npm install -g @angular/cli

安装完毕，可以验证ng -v了！

 

----------------------------------------------我是分割线--------------------------------------------------------------

注意：下面的安装时我项目要运行需要的，如果只是安装angular，那么到这里就安装完毕了。

如果Angular安装失败需要重新安装，使用一下命令先卸载失败的angular

命令：npm uninstall @angular/cli

           npm cache verify --force

------------------------------------------------我是分割线--------------------------------------------------------------

三：安装visual studio code

下载路径：https://code.visualstudio.com/

 

安装 visual studio code一路next就行，安装完毕后就可以准备把客户端项目导入了。

1.将项目导入visual studio code中并开启终端

 启动软件后，点击file->open folder选择你项目的文件夹（比如我的：main-app），然后点击terminal，如图：点击1，会出现2命令行，3出处是可以切换多个terminal

 

2.最后运行npm install，编辑前段项目（相当于java build项目，会导入前段所需要的包以及生成module的js、css文件）

 

3.如果显示编译成功运行npm satrt启动项目，在启动服务端。ok项目完整启动，去地址栏访问看看吧。