Vue学习笔记 7 - Vue CLI 相关

什么是 Vue CLI

如果你只是简单写几个 Vue 的 Demo 程序，那么你不需要 Vue CLI。但如果你在开发大型项目，那么你必然需要使用 Vue CLI。

• 使用 Vue.js开发大型应用时，我们需要考虑代码目录结构、项目结构和部署、热加载、代码单元测试等事情。

• 如果每个项目都要手动完成这些工作，那无疑比较低效，所以通常我们会使用一些脚手架工具来帮助完成这些事情。

• CLI 是什么意思？

  • CLI 是 Command-Line Interface，翻译为命令行界面，俗称脚手架。
  • Vue CLI是一个官方发布 vue.js 项目脚手架。
  • 使用 vue-cli 可以快速搭建 Vue 开发环境以及对应的 webpack 配置。

 

Vue CLI 使用前提 —— Node、Webpack

macOS 环境下Webpack与Node安装

 

Vue CLI的使用

• 安装 Vue 脚手架

sudo npm install -g @vue/cli

可以通过运行以下命令来初始化项目：

vue create my-project

• 上面安装的是Vue CLI 3 的版本，如果我们还需要同时使用旧版本的vue-init功能初始化项目是不行的，我们还需要全局安装一个桥接工具来拉取 2.x 版本：

sudo npm install @vue/cli-init -g

Vue CLI 2 初始化项目：

vue init webpack my-project

Vue CLI2 初始化项目过程(**** p91)

vue init webpack my-project

安装完成：

 

参考视频：小码哥 Vue ****