workflow(dev): support 'unplugin-vue2-script-setup' for vue 2.6

Author: cloydlau

scripts/dev.mts

@@ -1,10 +1,13 @@
+// pnpm add prompts cross-spawn kolorist magicast -D -w
+
 import fs from 'node:fs'
 import { execSync } from 'node:child_process'
 import prompts from 'prompts'
 import spawn from 'cross-spawn'
 import { loadFile, writeFile } from 'magicast'
-import type { ASTNode, ProxifiedImportItem } from 'magicast'
+import type { ASTNode } from 'magicast'
 import { cyan } from 'kolorist'
+import { addVitePlugin } from 'magicast/helpers'
 
 type VueVersion = '3' | '2.7' | '2.6'
 
@@ -33,6 +36,7 @@ const vueVersionToDeps: Record<VueVersion, Record<string, string>> = {
     '@vue/composition-api': 'latest',
     '@vue/test-utils': 'legacy',
     'vite-plugin-vue2': 'latest',
+    'unplugin-vue2-script-setup': 'latest',
     'vue': '~2.6.14',
     'vue-template-compiler': '~2.6.14',
   },
@@ -50,45 +54,62 @@ async function dev() {
     return
   }
 
-  const { shouldUpgradeDependencies } = await prompts({
+  /* const { shouldUpgradeDependencies } = await prompts({
     type: 'confirm',
     name: 'shouldUpgradeDependencies',
     message: 'Upgrade dependencies',
-  })
+  }) */
 
   console.log(cyan('Fetching origin...'))
   spawn.sync('git', ['pull'], { stdio: 'inherit' })
 
   console.log(cyan(`Switching to Vue ${targetVersion}...`))
-
   const mod = await loadFile('./vite.config.ts')
 
-  let isViteConfigChanged = false
+  // imported 表示命名导入的值，默认导入是 default
+  // k 和 mod.imports[k].local 和 constructor 三者一致，表示导入取的别名
 
+  // 删掉 vue 相关引入
+  const existedVuePlugins: Record<string, boolean> = {}
   for (const k in mod.imports) {
     for (const vueVersion in vueVersionToVitePlugin) {
-      if (mod.imports[k].from === vueVersionToVitePlugin[vueVersion as VueVersion] && targetVersion !== vueVersion) {
+      if (mod.imports[k] && [vueVersionToVitePlugin[vueVersion as VueVersion], 'unplugin-vue2-script-setup/vite'].includes(mod.imports[k].from)) {
         delete mod.imports[k]
-        isViteConfigChanged = true
-        break
+        existedVuePlugins[k] = true
       }
     }
   }
 
-  if (!mod.imports.vue) {
-    mod.imports.vue = {
-      imported: targetVersion === '2.6' ? 'createVuePlugin' : 'default',
-      local: 'vue',
-      from: vueVersionToVitePlugin[targetVersion],
-    } as ProxifiedImportItem
-    isViteConfigChanged = true
+  // 删掉 vue 相关插件
+  const options = mod.exports.default.$type === 'function-call'
+    ? mod.exports.default.$args[0]
+    : mod.exports.default
+  if (Object.keys(existedVuePlugins).length && options.plugins?.length) {
+    for (let i = options.plugins.length - 1; i > 0; i--) {
+      const p = options.plugins[i]
+      if (p?.$type === 'function-call' && existedVuePlugins[p.$callee]) {
+        options.plugins.splice(i, 1)
+      }
+    }
   }
 
-  if (isViteConfigChanged) {
-    await writeFile(mod as unknown as ASTNode, './vite.config.ts')
-    spawn.sync('npx', ['eslint', './vite.config.ts', '--fix'], { stdio: 'inherit' })
+  // 添加 vue 相关插件
+  addVitePlugin(mod, {
+    from: vueVersionToVitePlugin[targetVersion],
+    imported: targetVersion === '2.6' ? 'createVuePlugin' : 'default',
+    constructor: 'vue',
+  })
+  if (targetVersion === '2.6') {
+    addVitePlugin(mod, {
+      from: 'unplugin-vue2-script-setup/vite',
+      imported: 'default',
+      constructor: 'ScriptSetup',
+    })
   }
 
+  await writeFile(mod as unknown as ASTNode, './vite.config.ts')
+  spawn.sync('npx', ['eslint', './vite.config.ts', '--fix'], { stdio: 'inherit' })
+
   let isDepsChanged = false
 
   const pkg = JSON.parse(fs.readFileSync('./package.json', 'utf-8'))
@@ -118,18 +139,18 @@ async function dev() {
     fs.writeFileSync('./package.json', JSON.stringify(pkg, null, 2))
     console.log(cyan('Linting package.json...'))
     spawn.sync('npx', ['eslint', './package.json', '--fix'], { stdio: 'inherit' })
-    if (!shouldUpgradeDependencies) {
-      installDependencies()
-    }
+    // if (!shouldUpgradeDependencies) {
+    await installDependencies()
+    // }
   }
 
-  if (shouldUpgradeDependencies) {
+  /* if (shouldUpgradeDependencies) {
     installDependencies()
-  }
+  } */
 
   spawn.sync('npx', ['vite', '--open'], { stdio: 'inherit' })
 
-  function installDependencies() {
+  async function installDependencies() {
     console.log(cyan('Checking pnpm version...'))
     const latestPNPMVersion = spawn.sync('npm', ['view', 'pnpm', 'version']).stdout.toString().trim()
     const currentPNPMVersion = spawn.sync('pnpm', ['-v']).stdout.toString().trim()