用vue-cli创建一个vue项目从0到1

1、先全局安装node.js，选择自己需要下载的版本即可

• node.js下载地址

  https://nodejs.org
  

• 查看一下当前node版本，输出版本号则安装成功

  node -v
  

• 检查一下npm包，输出版本号则安装成功

  npm -v
  

• npm有局限性，安装cnpm淘宝镜像

  npm install -g cnpm --registry=https://registry.npm.taobao.org
  

2、等待npm安装完成后，安装vue-cli

• vue-cli安装命令

  cnpm install -g vue-cli
  

• 安装项目所需依赖可以用cnpm i 代替 cnpm install

  cnpm i
  

3、安装webpack，安装最新的或者特定的版本

• 根据自己需要选择本地还是全局安装
• webpack本地安装命令

  cnpm install --save-dev webpack
  

• webpack全局安装命令

  cnpm install --global webpack
  

• 查看一下当前版本，输出版本号则安装成功

  webpack -v
  

• webpack-dev-server 工具实现自动打包编译功能

  cnpm install --save-dev webpack-dev-server
  

4、用命令创建一个自己的vuedemo

• 使用脚手架创建vuedemo

  vue init webpack vuedemo
  

• 如图所示，选择自己需要的下载即可，如果都需要一路回车就可以
  
• 进入vuedemo文件夹

  cd vueDemo
  

• 运行项目到浏览器

   npm run dev