本文是对 Vue CLI 官方文档 复习的摘抄笔记（非原创，侵删）

前文指路：Vue CLI 学习笔记 1

基础

插件和 Preset

插件

1. 安装和管理插件

• 命令：vue add 插件名；
• ⚠️ 注意： vue add 的设计意图是为了安装和调用 Vue CLI 插件，但这不意味着替换普通的 npm 包，对于这些普通 npm 包，仍然需要选用包管理器；
• vue CLI的插件，可以通过 vue ui 命令使用 GUI 安装和管理；

2. 项目本地插件

• 如果不需要创建完整插件，只是在项目里直接访问插件 API，可以在 package.json 文件中使用 vuePlugins.service 选项：

{
  "vuePlugins": {
    "service": ["my-commands.js"]
  }
}

• 每个文件都需要暴露一个函数接受插件 API 作为第一个参数，也可以通过 vuePlugins.ui 添加例如 UI 插件一样的文件：

{
  "vuePlugins": {
    "ui": ["my-ui.js"]
  }
}

Preset

1. Vue CLI preset 是一个事先设置好的 JSON 对象，让用户在创建新项目的时候免去选择预定义选项和插件的操作；
2. 在创建项目的过程中，保存的 preset 在 home 目录下的配置文件 ~/.vuerc 中，可以通过直接编辑该文件，调整、添加、删除保存好的 preset，如下是我 home 目录下的 .vuerc 文件
   
3. 版本管理：推荐为 preset 列出的素有第三方插件提供显式版本范围，例如制定用到的版本如下：

{
  "plugins": {
    "@vue/cli-plugin-eslint": {
      "version": "^3.0.0",
      // ... 该插件的其它选项
    }
  }
}

4. 允许命令提示： 在 preset 中声明允许提示：

{
  "plugins": {
    "@vue/cli-plugin-eslint": {
      // 让用户选取他们自己的 ESLint config
      "prompts": true
    }
  }
}

5. 远程使用 preset：

• 上传的 git repo 需要包含 preset.json(必需)、generator.js 和 prompts.js
• 通过 --preset 选项远程使用 preset
• 如果要从私有 repo 获取，确保使用 --clone 选项

6. 加载问题

• 开发远程 preset 时，需要向远程 repo 发 push 反复测试，为简化流程，也可直接在本地测试；
• 如果 --preset 选项的值是一个相对或绝对文件路径，或以 .json 结尾，则 Vue CLI 会加载本地 preset(ST NOTE: 此处存疑，对文档不是很理解)：

# ./my-preset 应当是一个包含 preset.json 的文件夹
vue create --preset ./my-preset my-project

# 或者，直接使用当前工作目录下的 json 文件：
vue create --preset my-preset.json my-project