素材巴巴 > 程序开发 >

angular环境创建 创建项目

程序开发 2023-09-04 06:50:07

一、什么是angular

angular是一套js框架,由Google开发和维护,主要用来开发单页面的应用程序(SPA)。具有组块化、模块化、指令等特性。

二、angular的搭建环境

在使用angular之前需要为我们的计算机搭建一个angular环境,搭建方法如下:

1、安装Node.js

Node.js是javascript的运行环境,而angular是一套javascript的框架,所以是有必要安装Node.js的。

安装地址:http://nodejs.cn/download/

判断是否安装成功的方法,打开cmd,输入node -v,如果有版本号,则说明安装成功:

2、安装npm

npm随着Node的安装会一起安装进来,它可以解决Node.js代码部署上的很多问题。

判断是否存在的方法,和上面一样,打开cmd,输入npm -v,如果有版本号,说明安装成功:

3、安装cnpm

cnpm是淘宝团队做的国内镜像,因为npm的服务器位于国外可能会影响安装,使用cnpm可以避免很多的麻烦,建议大家安装cnpm。

安装方法:命令提示符执行

npm install cnpm -g --registry=https://registry.npm.taobao.org

4、安装angular脚手架

angular脚手架是angular官方开发的一个类似于vue脚手架开发工具,帮我们集成了webpack打包、开发服务器、单元测试、自动编译、部署等功能。

安装方法,建议使用cnpm安装:

命令指示符输入:

cnpm install -g @angular/cli

判断是否安装成功,输入ng --version,如下图就算是安装完成。

三、创建项目

1、到这里环境就算是搭建完成,然后就可以创建项目,创建项目的方法,找到一个合适的磁盘位置,然后输入 ng new项目名称即可。

项目默认创建的是C盘,如果想安装到其他盘当中,操作如下:我是将其安装在D盘目录下的一个叫做angular2的文件夹下面,前面加上cd。然后会提示是否安装路由,一般后面的学习是用到的,但是我的项目前面用不到,可以选择NO。

然后出现一直安装的状态,这个时候Ctrl+c结束安装,然后手动输入自己要选择路径,使用cnpm进行安装,一般还是上面的路径:会有一点慢,差不多两三分钟。

2、然后打开项目即可,输入ng serve --open,等待几分钟,最后会弹出一个网站,关闭即可,出现下图,代表安装成功:

3、到这里就可以下载编辑器,可以下载visual studio code,我下载的是英文版本,然后切换到中文版本,方法如下:

https://jingyan.baidu.com/article/b24f6c8277d36886bee5da6d.html

然后就可以打开项目,选择左上角文件——打开文件夹,找到目标文件,如下程度即可:然后选择文件夹即可。

到这里angular环境的搭建和项目的创建就结束了,感谢观看。


标签:

上一篇: console.log 样式 下一篇:
素材巴巴 Copyright © 2013-2021 http://www.sucaibaba.com/. Some Rights Reserved. 备案号:备案中。