1. VueCli
CLI 是 Commond-Line Interface 的缩写
如果开发大型项目,肯定需要考虑代码目录结构、项目结构和部署、热加载、代码单元测试等事情,那么你必然需要使用 VueCLI,使用 VueCLI 可以快速搭建 vue 开发环境以及对应的 webpack 配置。
2. 安装VueCli
VueCli 的安装依赖于 node.js 和 webpack(大家自行百度安装)
//默认安装脚手架3 npm install -g @vue/cli //安装脚手架2 npm install -g @vue/cli-init //脚手架2创建项目 vue init webpack my-project
3. 创建项目
//脚手架3创建项目 vue create my-project // 运行项目 npm run serve
4. vue-cli 3 与 vue-cli 2 版本的区别
- vue-cli 3 是基于 webpack 4 打造,vue-cli 2 还是 webapck 3
- vue-cli 3的设计原则是“0配置”,移除的配置文件根目录下的,build和config等目录
- vue-cli 3 提供了 vue ui命令,提供了可视化配置,更加人性化
- 移除了static文件夹,新增了public文件夹,并且index.html移动到public中
5. 安装报错
错误:npm ERR! code EAI_AGAIN
可以尝试的解决方法如下:
- 设置网络代理,这个需要与网络管理员确认,命令:
npm config set proxy http://192.168.1.2:8080
- 修改npm的源:
npm config set registry https://registry.npm.taobao.org
,输入npm config get registry
验证成功。 - 关闭ssl选项:
npm config set strict-ssl false
- 清空缓存等