如何使用npm和nodejs下载和运行AngularJS项目

AngularJS是一款基于MVW的JavaScript框架,有双向绑定、模块化和自动化等优点。其中,angular-cli是AngularJS一种脚手架,可以快速搭建AngularJS项目。下面利用详细步骤讲述如何搭建AngularJS项目并运行,操作如下:

工具/原料

  • AngularJS

  • NodeJS

  • npm

  • HBuilder

  • 浏览器

  • HTML5

  • CSS3

  • JavaScript

  • TypeScript

  • 截图工具

方法/步骤

1. 在D盘创建一个空白文件夹myProjects,使用visual ststudio code编辑器打开;

2. 右键myProjects文件夹,打开terminal(命令行窗口);

3. 查看系统是否安装node.js和npm,并查看对应的版本;

node -v   

npm -v 

4. 安装angular-cli;   

npm install -g angular-cli

如何使用npm和nodejs下载和运行AngularJS项目_第1张图片

5. 初始化并新建项目myBlog;此时projects文件夹中就生成了对应的项目文件;

ng new myBlog

如何使用npm和nodejs下载和运行AngularJS项目_第2张图片

如何使用npm和nodejs下载和运行AngularJS项目_第3张图片

6. 下载安装完毕之后,将路径切换到已创建好的项目目录下;

npm install

7. 运行AngularJS项目;

ng serve --open

如何使用npm和nodejs下载和运行AngularJS项目_第4张图片

8. 项目启动完成之后,在浏览器中打开一个界面,显示AngularJS图标;

如何使用npm和nodejs下载和运行AngularJS项目_第5张图片

注意事项

  • 注意检测Node.js和npm版本号

  • 注意angular-cli安装和运行angular项目

你可能感兴趣的:(web前端框架,-,AngularJS)