angularjs2环境搭建(webpack)

1、首先使用命令安装 @angular/cli  

       npm install -g @angular/cli

2、如果不知道安没安装@angular/cli  可以使用命令 ng -v 查看

     angularjs2环境搭建(webpack)_第1张图片    

3、使用 ng new 项目名称   创建名称

    angularjs2环境搭建(webpack)_第2张图片

    这个需要安装一会  耐心等待。。。。

4、本人使用的 Visual Studio Code打开项目

    angularjs2环境搭建(webpack)_第3张图片

5、使用 ng serve启动项目

    angularjs2环境搭建(webpack)_第4张图片

6、浏览器输入 http://localhost:4200  出现下图 则证明启动成功

   angularjs2环境搭建(webpack)_第5张图片

7、自定义个自己的模块  比如叫做 test目录

     使用命令ng g c 目录名

     angularjs2环境搭建(webpack)_第6张图片

      angularjs2环境搭建(webpack)_第7张图片

8、在test.component.html中定义一个名字

     angularjs2环境搭建(webpack)_第8张图片

9、在app.html中引用

     angularjs2环境搭建(webpack)_第9张图片

10、访问

    angularjs2环境搭建(webpack)_第10张图片

你可能感兴趣的:(angularjs,angularjs2环境搭建)