taro 4.x主包适配效能插件 (#17492)

* feat: cli安装后，如果内网自动安装效能插件

* fix: fetch换成axios，兼容3.x

* feat: 精细化控制，Taro项目内执行某命令，只加载该命令相关的的全局插件

* fix: 更新效能插件包名

* fix: 全局命令默认加载所有全局插件

* feat: 1.暴露viteCompilerContext给modifyViteConfig;2.vite编译h5时补充onBuildFinish钩子

* refactor: 移除无用代码

* fix: 使用项目里的taro

* fix: 修正项目内taro的引用路径

* refactor: review微调

* docs: 微调日志

---------

Co-authored-by: zhengyanan18 <zhengyanan18@jd.com>

Author: zhengyanan1

packages/taro-cli/package.json

@@ -8,6 +8,7 @@
   "types": "dist/index.d.ts",
   "scripts": {
     "prod": "pnpm run build",
+    "postinstall": "node postinstall.js",
     "test": "cross-env NODE_ENV=test jest",
     "test:ci": "cross-env NODE_ENV=test jest --ci -i --coverage --silent",
     "test:dev": "cross-env NODE_ENV=test jest --watch",
@@ -23,6 +24,7 @@
     "src",
     "dist",
     "templates",
+    "postinstall.js",
     "index.js",
     "global.d.ts"
   ],

packages/taro-cli/postinstall.js

@@ -0,0 +1,14 @@
+const { exec } = require('child_process')
+const axios = require('axios')
+
+axios.get('https://taro.jd.com/', { timeout: 5000 })
+  .then(() => {
+    exec('./bin/taro global-config add-plugin  @jdtaro/plugin-build-report-performance@latest --registry http://registry.m.jd.com', (error, _stdout, _stderr) => {
+      if (error) {
+        console.error(`install performance plugin error: ${error}`)
+      }
+    })
+    console.log('cli postinstall success')
+  })
+  .catch(() => {
+  })

packages/taro-cli/src/cli.ts

@@ -7,7 +7,7 @@ import * as minimist from 'minimist'
 import customCommand from './commands/customCommand'
 import { getPkgVersion } from './util'
 
-const DISABLE_GLOBAL_CONFIG_COMMANDS = ['build', 'global-config', 'doctor', 'update', 'config']
+const DISABLE_GLOBAL_CONFIG_COMMANDS = ['global-config', 'doctor', 'update', 'config']
 const DEFAULT_FRAMEWORK = 'react'
 
 export default class CLI {

packages/taro-cli/src/presets/commands/build.ts

@@ -145,13 +145,14 @@ export default (ctx: IPluginContext) => {
                 },
               })
             },
-            async modifyViteConfig(viteConfig, data) {
+            async modifyViteConfig(viteConfig, data, viteCompilerContext) {
               await ctx.applyPlugins({
                 name: hooks.MODIFY_VITE_CONFIG,
                 initialVal: viteConfig,
                 opts: {
                   viteConfig,
                   data,
+                  viteCompilerContext
                 },
               })
             },

packages/taro-service/src/Config.ts

@@ -15,6 +15,7 @@ import {
 import * as ora from 'ora'
 import { merge } from 'webpack-merge'
 
+import { filterGlobalConfig } from './utils'
 import {
   CONFIG_DIR_NAME,
   DEFAULT_CONFIG_FILE
@@ -52,6 +53,7 @@ export default class Config {
       if (this.disableGlobalConfig) return
       this.initGlobalConfig()
     } else {
+      this.initGlobalConfig(configEnv.command)
       createSwcRegister({
         only: [
           filePath => filePath.indexOf(path.join(this.appPath, CONFIG_DIR_NAME)) >= 0
@@ -67,14 +69,15 @@ export default class Config {
     }
   }
 
-  initGlobalConfig () {
+  initGlobalConfig (command: string = '') {
     const homedir = getUserHomeDir()
     if (!homedir) return console.error('获取不到用户 home 路径')
     const globalPluginConfigPath = path.join(getUserHomeDir(), TARO_GLOBAL_CONFIG_DIR, TARO_GLOBAL_CONFIG_FILE)
     if (!fs.existsSync(globalPluginConfigPath)) return
     const spinner = ora(`开始获取 taro 全局配置文件： ${globalPluginConfigPath}`).start()
     try {
       this.initialGlobalConfig = fs.readJSONSync(globalPluginConfigPath) || {}
+      this.initialGlobalConfig = filterGlobalConfig(this.initialGlobalConfig, command)
       spinner.succeed('获取 taro 全局配置成功')
     } catch (e) {
       spinner.stop()

packages/taro-service/src/utils/index.ts

@@ -6,7 +6,7 @@ import * as resolve from 'resolve'
 
 import { PluginType } from './constants'
 
-import type { PluginItem } from '@tarojs/taro/types/compile'
+import type { IProjectConfig, PluginItem } from '@tarojs/taro/types/compile'
 import type { IPlugin, IPluginsObject } from './types'
 
 export const isNpmPkg: (name: string) => boolean = name => !(/^(\.|\/)/.test(name))
@@ -117,3 +117,19 @@ export function printHelpLog (command, optionsList: Map<string, string>, synopsi
     })
   }
 }
+
+export function filterGlobalConfig (globalConfig: IProjectConfig, command: string) {
+  if (!command) {
+    return globalConfig
+  }
+  const config = globalConfig
+
+  const RelatedPluginTag = `@jdtaro/plugin-${command}-`
+  if (config.plugins?.length) {
+    config.plugins = config.plugins.filter(pluginName => {
+      return pluginName.includes(RelatedPluginTag)
+    })
+  }
+
+  return config
+}

packages/taro-service/src/utils/types.ts

@@ -151,7 +151,7 @@ export declare interface IPluginContext {
   /**
    * 编译中修改 vite 配置
    */
-  modifyViteConfig: (fn: (args: { viteConfig: any, data?: IModifyChainData }) => void) => void
+  modifyViteConfig: (fn: (args: { viteConfig: any, data?: IModifyChainData, viteCompilerContext: any }) => void) => void
   /**
    * 修改编译后的结果
    */

packages/taro-vite-runner/src/h5/pipeline.ts

@@ -1,16 +1,17 @@
 import { VITE_COMPILER_LABEL } from '@tarojs/runner-utils'
+import { isFunction } from '@tarojs/shared'
 
 import { getMode } from '../utils'
 
 import type{ ViteH5CompilerContext } from '@tarojs/taro/types/compile/viteCompilerContext'
 import type { PluginOption } from 'vite'
 
 export default function (viteCompilerContext: ViteH5CompilerContext): PluginOption {
+  const { taroConfig } = viteCompilerContext
   return {
     name: 'taro:vite-h5-pipeline',
     enforce: 'pre',
     async buildStart () {
-      const { taroConfig } = viteCompilerContext
       const isProd = getMode(taroConfig) === 'production'
       // 下面这么写 是因为生产环境不需要异步，开发环境需要异步。是因为插件的执行顺序正确而这么写的
       isProd
@@ -25,6 +26,16 @@ export default function (viteCompilerContext: ViteH5CompilerContext): PluginOpti
     },
     load (id) {
       if (id === VITE_COMPILER_LABEL) return ''
+    },
+    closeBundle () {
+      const onBuildFinish = taroConfig.onBuildFinish
+      if (isFunction(onBuildFinish)) {
+        onBuildFinish({
+          error: null,
+          stats: {},
+          isWatch: taroConfig.isWatch
+        })
+      }
     }
   }
 }

packages/taro-vite-runner/src/index.h5.ts

@@ -44,9 +44,13 @@ export default async function (appPath: string, rawTaroConfig: ViteH5BuildConfig
     plugins
   }
 
-  taroConfig.modifyViteConfig?.(commonConfig, {
-    componentConfig
-  })
+  taroConfig.modifyViteConfig?.(
+    commonConfig,
+    {
+      componentConfig
+    },
+    viteCompilerContext
+  )
 
   if (isProd) {
     await build(commonConfig)

packages/taro-vite-runner/src/index.harmony.ts

@@ -32,8 +32,12 @@ export default async function (appPath: string, rawTaroConfig: ViteHarmonyBuildC
     plugins,
   }
 
-  taroConfig.modifyViteConfig?.(commonConfig, {
-    componentConfig
-  })
+  taroConfig.modifyViteConfig?.(
+    commonConfig,
+    {
+      componentConfig
+    },
+    viteCompilerContext
+  )
   await build(commonConfig)
 }