从node到vue2.0开发环境的安装

时间:2024-03-19 20:47:57

vue官方中文站 https://cn.vuejs.org/v2/guide/index.html 

node官方中文站 http://nodejs.cn/

1.安装node.js

https://nodejs.org/en/ 下载node.js安装文件

从node到vue2.0开发环境的安装

这里我选择了8.11.1  开发者也可以根据需要选择历史版本下载;

打开node安装文件,只需要下一步即可;

从node到vue2.0开发环境的安装

选择安装方式,安装位置,安装完毕后结束关闭即可

从node到vue2.0开发环境的安装

安装完毕后 在运行-cmd里查看当前系统环境变量以及node版本,成功查询到版本说明安装成功

查看系统变量:path

查看node版本:node -v

从node到vue2.0开发环境的安装

2.安装vue.js环境

安装cnpm:

在命令行中输入: npm install -g cnpm --registry=http://registry.npm.taobao.org

从node到vue2.0开发环境的安装

(cnpm是npm淘宝镜像依赖,用于解决网络不好或者外网连接部分依赖无法加载或者加载时间过长的问题)

安装vue-cli脚手架构建工具

在命令行中运行命令: npm install -g vue-cli 

我已经安装完了,所以不上截图了,这里一般没什么问题

在vue-cli脚手架中构建项目

打开要建立项目的根目录

从node到vue2.0开发环境的安装

运行命令: vue init webpack firstVue   初始化一个项目

从node到vue2.0开发环境的安装

在项目根目录下运行:npm run dev 

看到如图提示后,打开浏览器访问 http://localhost:8080 ,(8080为默认端口)成功访问就可以看到vue的项目环境搭建完成了

从node到vue2.0开发环境的安装