angular --开发环境搭建及项目建立

1.配置node环境

1）.下载node安装包并安装，如下下是个人node安装路径

2）.安装完成以后在 选择 个人电脑 右键 选属性-> 高级系统设置 ->  环境变量 -> 新建 

变量名自定义，变量值写node的安装路径

以下是个人变量值：

3).查看node是否安装成功：

win+r 进入输入cmd进入命令行，输入 node -v 命令 ，安装成功以后会显示node的版本号，以下所示：

到此node安装成功。

在命令行，输入 npm -v 命令 ，查看npm的版本号

 

2.配置python环境

若是不安装python的话在进行第3步安装时会出现与python相关的错误，

python的安装与node的安装步骤相同，能够参照node的安装。

查看python是否安装的命令为  python  。

 

3.安装angular-cli

1).由于angular-cli是用typescript写的，因此要先装这个： npm install -g typescript typings

2).安装angular-cli :  npm install -g @angular/cli

 若是你以前安装失败过，最好在安装angular-cli以前先卸载干净，使用一下命令：

      npm uninstall -g angular-cli
      npm cache clean 

 

以后进入以下目录，删除ng和ng.cmd这两个文件。

 

 

3).因为被墙的缘由按照普通方式安装可能会安装失败，所以能够设置淘宝镜像安装

设置方法1. npm config set registry https://registry.npm.taobao.org，

　　　　　　成功以后再使用  npm install -g @angular/cli 安装便可。

设置方法2.能够直接使用npm安装淘宝镜像：npm i -g cnpm,

　　　　　安装成功使用 cnpm i -g @angular/cli 安装便可。

安装指定的angula版本：cnpm install -g @angular/cli@1.6.3

4).若是安装过程出现下载node-sass失败 请尝试单独安装node-sass  安装命令： npm install --save-dev node-sass。

5).检查angular-cli是否安装成功，在命令行使用 ng -v 查看是否成功

4.建立angular项目

1).建立angular新项目命令：ng new projectName ;注：projectName为项目的名称，等待项目自动建立。

2).项目建立成功以后切换到项目的目录下，使用 ng serve 启动项目，编译完成能够在浏览器地址栏输入http://localhost:4200/，就能够看到新建立的项目。

5.开发工做

 接下来就可使用angular进行相关项目的代码编写

6.编译本地运行 ng serve

参照第4部分

7.打包

 进行打包 ng build 打包后会生成dist文件夹

angular的基本环境配置及编译基本结束，在angular2的开发中还有细节之处须要处理，在这里就不一一阐述，有什么问题能够私信或评论，若有不当之处还望指出^-^