vue-cli脚手架工具搭建vue-webpack项目

vue-cli是vue官方的脚手架工具，主要的功能是初始化项目。
主要作用：目录结构、本地调试、代码部署、热加载、单元测试

本机环境：Win10 64位

搭建流程

1.安装node.js

→ 前往Node.js官方网站 https://nodejs.org/en/
→下载适合本机环境的Node版本(建议安装LTS稳定版,按下一步下一步傻瓜式安装，忽略介绍)

→验证Node是否安装成功：

• 按快捷键【WIN+R】 打开命令面板,输入cmd确定

  
  
  

• 输入node -v 查看当前版本，有版本号说明安装成功

  
  
  

• 输入npm -v ,有版本号说明Node自带的npm也安装成功

  
  
  

2.全局安装vue-cli

→在node.js路径下输入npm install --global vue-cli

→输入vue -V (注意V是大写)检查vue是否安装成功

3.创建一个基于 webpack 模板的新项目

→选择好一个路径后，输入 vue init webpack my-project，其中my-project是项目名称，同时也是文件夹名称
→ 然后它会有好几个选项让你填写，一路enter,有两个no

→ 它帮我们执行了npm run install，这个是安装依赖，如果是打开已有项目而不是新建需要手动输入npm run install

4.执行

• 输入 cd my-project 打开项目

• 输入 npm run dev，运行效果如下