KuangPF / vue-cli-analysis

首先感谢你的分析分享

Background

看到vue create章节中Generator/GeneratorAPI中提到如下内容：

- render：利用 ejs 渲染模板文件
- onCreateComplete：内存中保存的文件字符串全部被写入文件后的回调函数
- exitLog：当 generator 退出的时候输出的信息

Question

onCreateComplete的描述Push a callback to be called when the files have been written to disk.在源码中也有体现

想咨询一下它真实的执行时机是在每个插件执行结束时回调，还是说有多个插件（preset形式）时其实是在所有插件执行后再执行onCreateComplete
目前的Vue CLI有单个插件结束回调或者单插件生命周期钩子这种东西吗

个人的关注点

插件本身或许应该具备一些生命周期回调，所以我将onCreateComplete默认为了每个插件的结束回调；基于这个判断我认为每个插件结束后会执行一下onCreateComplete，然后再执行其它插件

但是看了源代码之后发现，似乎onCreateComplete更像是整体插件的结束回调而不是单个插件的结束回调：源码体现

想咨询一下你对【Question】部分两个问题的判断是什么，如您有空可以回复一下

第一个问题

vue cli create 一个项目的时候会执行每个插件

vue-cli-analysis/packages/@vue/cli/lib/Generator.js

Line 111 in 43c484f

plugins.forEach(({ id, apply, options }) => {

// apply generators from plugins
    plugins.forEach(({ id, apply, options }) => {
      const api = new GeneratorAPI(id, this, options, rootOptions)
      apply(api, options, rootOptions, invoking)
    })

重点关注下 GeneratorAPI 中的 onCreateComplete

/**
   * Push a callback to be called when the files have been written to disk.
   *
   * @param {function} cb
   */
  onCreateComplete (cb) {
    this.generator.completeCbs.push(cb)
  }

可以看出只是将每个插件的 onCreateComplete push 到了 generator 中，然后在每个插件执行完以后才会统一执行 completeCbs

vue-cli-analysis/packages/@vue/cli/lib/Creator.js

Line 192 in 43c484f

for (const cb of createCompleteCbs) {

// run complete cbs if any (injected by generators)
    logWithSpinner('⚓', `Running completion hooks...`)
    this.emit('creation', { event: 'completion-hooks' })
    for (const cb of createCompleteCbs) {
      await cb()
    }

第二个问题

vue-cli 3.1.3 中貌似没有每个插件执行完了就单独执行回调或者说是插件的生命周期，都是在某个特点的节点上统一执行，最新版的 vue-cli 还没去研究。

好的，感谢你的回复
另外请教一下，你个人觉得脚手架插件需要拥有生命周期钩子吗
从目前vue cli的实现来看，其实vue cli并没有将插件看成一个独立的具有生命周期的实例，目前仅是一段可执行的逻辑

个人觉得单独的插件不太需要生命周期，或者从某种程度上来说当前 vue-cli 插件也拥有生命周期，比如里面的 onPromptComplete 以及 onCreateComplete。onPromptComplete 是在对话结束以后的回调，onCreateComplete 是在项目创建完成以后的回调，其实这两个就是生命周期，只是这个过程是相对于 vue-cli create 这个流程而不是插件本身。vue-cli 的插件目的是为了增强项目，让项目具有更高的可配置性，但是主体还是 vue-cli 本身，插件起到了一个扩展的作用。

好的，十分感谢你的回复

[Question] 针对Vue cli部分Api执行时机的疑问

Background

Question

个人的关注点

第一个问题

第二个问题