vue cli 3学习要点

只整理了一下vue cli 3的基础内容部分，其他的见官网：

https://cli.vuejs.org/zh/guide/installation.html

一、简介vue3

1.它可以通过 vue create 快速创建一个新项目的脚手架，或者直接通过 vue serve 构建新想法的原型，不需要vue2.0那样用webpack来构建项目

2.在项目创建的过程中，你也会被提示选择喜欢的包管理器或使用淘宝npm镜像源以更快地安装依赖。这些选择也将会存入 ~/.vuerc。

 

二、插件和 Preset

在现有的项目中安装插件

1.在现有的项目中安装插件使用 vue add 命令,但这个命令是为了安装和调用 Vue CLI 插件。这不意味着替换掉普通的 npm 包。对于这些普通的 npm 包，你仍然需要选用包管理器（即插件分为了cli插件和第三方的用npm安装的插件）

vue add @vue/eslint 解析为完整的包名： @vue/cli-plugin-eslint（vue cli类型的插件）

vue add apollo（不带 @vue 前缀）会安装第三方插件： vue-cli-plugin-apollo（第三方插件，不属于vue cli类型的插件）

2.每个 CLI 插件都会包含一个 (用来创建文件的) 生成器和一个 (用来调整 webpack 核心配置和注入命令的) 运行时插件。

 

 

三、Preset

1.一个 Vue CLI preset （即其他第三方插件是不会受影响的，配置啥的也是不会放在~/.vuerc文件里的）是一个包含创建新项目所需预定义选项和插件的 JSON 对象。

2.创建新项目所需预定义选项和cli插件，这个文件里的插件会自动安装，不需要你自己手动安装了。在 vue create 过程中保存的 preset 会被放在你的 home 目录下的一个配置文件中 (~/.vuerc)。

3.如果你需要在项目里直接访问插件 API 而不需要创建一个完整的插件，你可以在 package.json 文件中使用 vuePlugins.service 选项

4.preset这个JSON对象呢，里面可设置各个字段，来对所有cli插件进行控制

5.你还可以远程 Preset，通过发布 git repo 将一个 preset 分享给其他开发者（应该就是在github上发布一个文件夹？这个有待进一步学习），文件包含的具体内容看官网。发布 repo 后，你就可以在创建项目的时候通过 --preset 选项使用这个远程的 preset 了

 

四、cli服务

1.缓存和并行处理

cache-loader 会默认为 Vue/Babel/TypeScript 编译开启。文件会缓存在 node_modules/.cache 中——如果你遇到了编译方面的问题，记得先删掉缓存目录之后再试试看