Angular2.0CLI安装指南

    xiaoxiao2021-03-25  62

    搭建AngularJS-CLI首先需要在windows上装node.js。安装node.js步骤:

    1、http://download.csdn.net/download/huiling815/9709009     这是下载地址!!!!!!!!

    2、然后一路next,默认是装到C盘的,我就装到了C盘

    3、最后测试node是否安装成功,打开cmd,输入node -v,如果出现版本信息,证明安装成功,反之,亦然。

    然后开始搭建AngularJS-CLI:

    1、先添加淘宝的npm镜像(由于国内访问国外网站的速度实在是太慢了),由于我们只有要用到的一些东西,我

    们采用以下的添加镜像方法

    2、(windows 用户使用cmd,输入以下命令)

    npmconfig set registryhttps://registry.npm.taobao.org

    3、如果你之前安装失败过,最好在安装angular-cli之前先卸载干净,用以下   两句:

     npm uninstall -g angular-cli 

     npm cache clean

    4、然后在cmd命令中输入:cnpm install -g angular-cli,开始安装AngularJS-CLI等待。。。。。。。。时间可能比较

    长,耐心等待!

    5、安装完毕后,试下ng -v 和ng help,有显示正确内容就成功了

    6、通过cmd命令进入C:\Users\用户\AppData\Roaming\npm\node_modules\angular-cli重新安装 npm install rxjs     之

    后我们就可以在全局使用ng命令了

    7、首先到你的工作目录下建立Angular工程目录

       然后然后用命令行进入该目录,输入

       ng new projectName

    然后脚手架会帮我们搭建初始环境,由于初始化的时候Angualr-cli会去初始化node-modules依赖,所以会比较慢;如果没有切换淘宝镜像,会 非常慢。

    耐心等待!!!!!!!!!!!!!!!!!!!!!!!

    最后安装成功!!!!!!!!!

    就这样,最简单的angular2工程创建好了;

    工程结构熟悉一下:angular-cli.json 是angular-cli的配置文件,测试配置文件karma.conf.js,typescript的lint配置文

    件,端到端的测试配置文件protractor.conf.js,导入es6模块的配置文件polyfills.ts,angular工程的main.ts引导启动文

    件,全局样式style.css,typescript配置文件ts.config.json;typescript的声明文件typings.d.ts,以及生成了最贱的的一个

    angular组建 app.components相关的css,html,ts。这些配置都是angular2的生产项目中需要配置的文件,angular-

    cli帮我们做了这么多事情,我们只用了一个命令;(这些玩意我也没看懂!!!!!!)

    9、然后输入cd projectName

       命令行进入进入刚才的工程目录,输入

       ng serve

    如果要是运行项目比较大的话可以用以下的命令

    ng serve --prod --aot

    10、浏览器输入 http://localhost:4200/就可以看到appworks

    因为默认的4200的端口,如果你需要换的话也是可以的package.json里面的

    ng serve --host localhost --port 4201

    OK!!!!!!!!!!!

    最后如果你的项目要在eclipse中的tomact上运行

    在cmd命令窗口输入 ng build --prod --aot

    会生成一个dist文件,把这个文件导入eclipse中就可以了!

    这个教程可能不全面。希望大家支持!!!!

    转载请注明原文地址: https://ju.6miu.com/read-32982.html

    最新回复(0)