1、打开node.js官网https://nodejs.org/en/下载当前版本node.js并安装到电脑中,安装方式为"无脑安装之下一步"

安装完成后检验是否安装node.js:
win+r输入cmd打开dos窗口输入node -v回车之后会显示node.js版本号,证明电脑安装成功了!
npm集成在node.js中,在dos窗口输入npm -v回车之后会显示npm版本!

2、利用淘宝镜像安装cnpm,在命令行中输入npm install -g cnpm --registry=https://registry.npm.taobao.org,
安装成功之后输入cnpm install -g vue-cli来安装vue-cli脚手架

3、开始创建vue项目,例如要在D盘创建vue项目。
dos命令行输入D: 进到D盘目录cd D:vueProject进入vueProject文件夹,输入vue init webpack projectName创建新的vue项目,其中projectName为项目名称,可设为任意名称。
回车之后会出现vue项目的配置属性:
Project name为项目名称
Project description为项目描述
Author为项目作者
Vue build为webpack配置文件默认回车就好
Install vue-router?是否安装路由配置
Use ESLint to lint your code?为eslint校验js代码语法的插件(可装可不装)
Set up unit tests?为设置测试单元默认No就可以
Setup e2e tests with Nightwatch?为vueE2E测试
Should we run 'npm install' for you after the project has been created?(recommended)默认npm安装
例如:

4、安装项目依赖
dos窗口定位到项目路径cd D:vueProject\projectName,然后输入cnpm install安装项目所需依赖包资源。
5、安装成功之后运行
dos窗口定位到项目路径cd D:vueProject\projectName,然后输入npm run dev回车运行项目,项目路径为http://localhost:8080


6、编辑器开发工具
推荐HbuilderX编辑器下载地址:http://www.dcloud.io/hbuilderx.html
原创文章链接:http://www.zhicaipt.cn/hz_index/view/article_detail.html?id=47
网友评论