创建与运行 Angular 前端项目

0
视频
0
完成
0%
进度
0
分钟
0
完成
0%
进度

打开终端,确定在你的系统上已经安装好了 Node.js,安装了 Node.js 会自带一个包管理工具 npm ..下面我们先用 npm 这个包管理工具在系统的全局范围,安装一下 Angular 命令行工具。

执行一下 npm install 要安装的是 @angular/cli,在全局范围安装一下它,使用这个命令行工具,可以创建新的 Angular 项目,还可以快速给项目创建一些需要的东西。完成以后,在终端,就可以使用 ng 这个命令。

npm install @angular/cli --global

进入到你想要保存项目的地方 .. 比如进入到桌面上 .. 在这里创建一个 Angular 项目,执行 ng new ,后面加上要创建的项目的名字 .. ninghao-angular

cd ~/desktop
ng new ninghao-angular

问我们想要使用 Angular 的路由功能吗,输入 y ,确定使用,又提示选择 CSS 样式的格式,暂时可以选择默认的 CSS。

ng 命令会给我们创建好一个 Angular 项目,并且安装好项目依赖的东西。完成以后,进入到项目所在目录 ninghao-angular,用编辑器打开项目,我用的是 VSCode 编辑器。

在本地运行项目的开发服务,需要执行一个特定的命令,在终端可以执行一下 Angular 的命令行工具提供的,ng serve。

或者可以执行一下 npm run start ,这个命令是在项目的 package.json 文件里定义的,对应的要执行的具体的命令就是 ng serve,所以你使用哪个命令都是可以的。

命令会给我们创建一个开发服务,预览当前正在开发的这个 Angular 项目,可以打开这个开发服务的地址,默认就是这个 localhost:4200,在浏览器上打开这个地址。

现在你会看到一个 Angular 的欢迎界面。

创建与运行 Angular 前端项目《 Angular:起步 》

统计

15260
分钟
0
你学会了
0%
完成

社会化网络

关于

微信订阅号

扫描微信二维码关注宁皓网,每天进步一点