vue-cli脚手架的安装与基础项目构建

环境搭建

 1.安装node.js，直接去官网下载就ok 传送门：https://nodejs.org/en/    安装成功之后 cmd  输入node -v  出现对应的版本号代表安装成功。

2.安装npm  ：   cmd控制台输入  npm install

3.由于npm安装较慢  ，使用淘宝镜像提升速度，控制台输入 npm install -g cnpm –registry=https://registry.npm.taobao.org

   之后输入  cnpm -v查看版本号  出现如下所示代表成功

4.安装webpack

    cmd输入   ：   cnpm install webpack -g

  webpack安装完成之后需要安装webpack-cli  注意  此时需要全局安装  控制台输入：cnpm install webpack-cli -g

安装成功之后输入   webpack -v   查看版本号  出现对应版本代表安装成功

5.安装vue-cli脚手架搭建工具 

 cmd输入：cnpm install vue-cli -g

然后输入vue -V   如果出现对应的版本号代表安装成功

至此，vue项目所需要的工具都已经安装好了，接下来使用vue-cli搭建一个最简单的vue项目

1.进入你想放工程的相关目录  cmd中使用  cd......指令(自行确认路径)    进入文件 之后安装vue   

   cmd输入  cnpm install vue

2.全局安装vue脚手架 (同样是在项目路径下)

 cmd输入： cnpm install –global vue-cli

3.创建一个基于 webpack 模板的新项目,打开命令输入：vue init webpack my-project 

具体每一个属性笔者也不是很清楚  所以从别的大佬那里扣了张图

完成 之后  输入 cnpm run dev      然后浏览器输入localhost:8080  会出现如下界面代表一个最简单的vue-cli项目搭建成功