素材巴巴 > 程序开发 >

第一次建angular项目

程序开发 2023-09-03 22:20:23

       在弄这个之前,只是听说过angular js ,angular。后来也有在网上看了一下菜鸟教程网站里的东西,就算是认识了一下,没有深入去研究,没办法,项目中要用到这个,看了一下别人写的代码,代码倒不是很难,大部分能看懂,但一些细节的东西还是不理解,想着吧,反正也要学会,就先动手试试建一个项目来看吧,先大体了解一下angular项目的目录结构,知道它每个目录下的文件的作用,理解了之后才能更加深入地学习,在建项目之前,首先确保电脑上已经安装了node.js,npm,angular cli等,不然无法愉快地耍下去啊,废话不说了,下面开始吧!

一、安装angular cli

第一步:win+R打开dos界面

确认已经安装好了node.js、npm,可以用显示当前的版本

 

第二步:安装angular cli

1) 要等一会,网络好的话应该不会太漫长,哈哈!

2)ng v

如果,出现如上图所示,那么,恭喜你,安装成功了

第三步:新建angular 项目(注意: my-app是我的项目名字,你可以随便取一个)

      ng new my-app --skip-install    // 新建项目my-app

第四步:

      cd my-app  //进入my-app目录下

第五步:

      npm install -g yarn   //安装yarn

第六步:

      yarn   //在my-app目录下使用yarn安装ng所以来的yarn

第七步:

      ng serve //启动angular项目

第八步:

    在浏览器地址栏输入http://localhost:4200/ 回车,出现下面的这种页面就说明新建项目成功了!

 

历经八步,还天龙八部呢,哈哈!今天我弄得时候在第五、六步这里踩了坑,出现莫名其妙的错误,最后无奈情况下,把项目删了,重新创建,皇天不负有心人,终于出现了第八步的图示。至此,项目新建完毕,至于编辑器嘛,在下先去玩玩,如果觉得可以,再作推荐。最后,如果有什么不对的地方,还请指出,一起交流,互相学习!

 

 

 


标签:

素材巴巴 Copyright © 2013-2021 http://www.sucaibaba.com/. Some Rights Reserved. 备案号:备案中。