refactor: 环境变量 VITE_APP_DEBUG_TOOL 改成用 vite 插件的方式注入代码中

.commitlintrc.js

@@ -0,0 +1,68 @@
+/** @type {import('cz-git').UserConfig} */
+export default {
+  rules: {
+    // @see: https://commitlint.js.org/#/reference-rules
+  },
+  prompt: {
+    alias: { fd: 'docs: fix typos' },
+    messages: {
+      type: '选择你要提交的类型 :',
+      scope: '选择一个提交范围（可选）:',
+      customScope: '请输入自定义的提交范围 :',
+      subject: '填写简短精炼的变更描述 :\n',
+      body: '填写更加详细的变更描述（可选）。使用 "|" 换行 :\n',
+      breaking: '列举非兼容性重大的变更（可选）。使用 "|" 换行 :\n',
+      footerPrefixsSelect: '选择关联issue前缀（可选）:',
+      customFooterPrefixs: '输入自定义issue前缀 :',
+      footer: '列举关联issue (可选) 例如: #31, #I3244 :\n',
+      confirmCommit: '是否提交或修改commit ?',
+    },
+    types: [
+      { value: 'feat', name: 'feat:     ✨  新增功能 | A new feature', emoji: ':sparkles:' },
+      { value: 'fix', name: 'fix:      🐛  修复缺陷 | A bug fix', emoji: ':bug:' },
+      { value: 'docs', name: 'docs:     📝  文档更新 | Documentation only changes', emoji: ':memo:' },
+      { value: 'style', name: 'style:    💄  代码格式 | Changes that do not affect the meaning of the code', emoji: ':lipstick:' },
+      { value: 'refactor', name: 'refactor: ♻️   代码重构 | A code change that neither fixes a bug nor adds a feature', emoji: ':recycle:' },
+      { value: 'perf', name: 'perf:     ⚡️  性能提升 | A code change that improves performance', emoji: ':zap:' },
+      { value: 'test', name: 'test:     ✅  测试相关 | Adding missing tests or correcting existing tests', emoji: ':white_check_mark:' },
+      { value: 'build', name: 'build:    📦️  构建相关 | Changes that affect the build system or external dependencies', emoji: ':package:' },
+      { value: 'ci', name: 'ci:       🎡  持续集成 | Changes to our CI configuration files and scripts', emoji: ':ferris_wheel:' },
+      { value: 'revert', name: 'revert:   ⏪️  回退代码 | Revert to a commit', emoji: ':rewind:' },
+      { value: 'chore', name: 'chore:    🔨  其他修改 | Other changes that do not modify src or test files', emoji: ':hammer:' },
+    ],
+    useEmoji: false,
+    emojiAlign: 'center',
+    themeColorCode: '',
+    scopes: [],
+    allowCustomScopes: true,
+    allowEmptyScopes: true,
+    customScopesAlign: 'bottom',
+    customScopesAlias: 'custom',
+    emptyScopesAlias: 'empty',
+    upperCaseSubject: false,
+    markBreakingChangeMode: true,
+    allowBreakingChanges: ['feat', 'fix'],
+    breaklineNumber: 100,
+    breaklineChar: '|',
+    skipQuestions: [],
+    issuePrefixs: [
+      // 如果使用 gitee 作为开发管理
+      { value: 'link', name: 'link:     链接 ISSUES 进行中' },
+      { value: 'closed', name: 'closed:   标记 ISSUES 已完成' },
+    ],
+    customIssuePrefixsAlign: 'top',
+    emptyIssuePrefixsAlias: 'skip',
+    customIssuePrefixsAlias: 'custom',
+    allowCustomIssuePrefixs: true,
+    allowEmptyIssuePrefixs: true,
+    confirmColorize: true,
+    maxHeaderLength: Number.POSITIVE_INFINITY,
+    maxSubjectLength: Number.POSITIVE_INFINITY,
+    minSubjectLength: 0,
+    scopeOverrides: undefined,
+    defaultBody: '',
+    defaultIssues: '',
+    defaultScope: '',
+    defaultSubject: '',
+  },
+}

src/App.vue

@@ -1,6 +1,4 @@
 <script setup lang="ts">
-import eruda from 'eruda'
-import VConsole from 'vconsole'
 import Provider from './ui-provider/index.vue'
 import eventBus from '@/utils/eventBus'
 import useSettingsStore from '@/store/modules/settings'
@@ -36,9 +34,6 @@ watch([
   deep: true,
 })
 
-import.meta.env.VITE_APP_DEBUG_TOOL === 'eruda' && eruda.init()
-import.meta.env.VITE_APP_DEBUG_TOOL === 'vconsole' && new VConsole()
-
 const enableAppSetting = import.meta.env.VITE_APP_SETTING === 'true'
 </script>
 

vite.config.ts

@@ -16,7 +16,7 @@ export default ({ mode, command }) => {
   })
   return defineConfig({
     base: './',
-    // 开发服务器选项 https://cn.vitejs.dev/config/#server-options
+    // 开发服务器选项 https://cn.vitejs.dev/config/server-options
     server: {
       open: true,
       port: 9000,
@@ -28,7 +28,7 @@ export default ({ mode, command }) => {
         },
       },
     },
-    // 构建选项 https://cn.vitejs.dev/config/#server-fsserve-root
+    // 构建选项 https://cn.vitejs.dev/config/build-options
     build: {
       outDir: mode === 'production' ? 'dist' : `dist-${mode}`,
       sourcemap: env.VITE_BUILD_SOURCEMAP === 'true',

vite/plugins/debug-tool.ts

@@ -0,0 +1,28 @@
+import type { Plugin } from 'vite'
+
+export default function createDebugTool(env): Plugin {
+  const { VITE_APP_DEBUG_TOOL } = env
+  return {
+    name: 'debug-plugin',
+    transform: (code, id) => {
+      if (/src\/main.ts$/.test(id)) {
+        if (VITE_APP_DEBUG_TOOL === 'eruda') {
+          code = code.concat(`
+            import eruda from 'eruda'
+            eruda.init()
+          `)
+        }
+        else if (VITE_APP_DEBUG_TOOL === 'vconsole') {
+          code = code.concat(`
+            import VConsole from 'vconsole'
+            new VConsole()
+          `)
+        }
+        return {
+          code,
+          map: null,
+        }
+      }
+    },
+  }
+}

vite/plugins/index.ts

@@ -14,6 +14,7 @@ import createCompression from './compression'
 import createArchiver from './archiver'
 import createConsole from './console'
 import createBanner from './banner'
+import createDebugTool from './debug-tool'
 
 export default function createVitePlugins(viteEnv, isBuild = false) {
   const vitePlugins: (PluginOption | PluginOption[])[] = [
@@ -36,5 +37,6 @@ export default function createVitePlugins(viteEnv, isBuild = false) {
   vitePlugins.push(createArchiver(viteEnv))
   vitePlugins.push(createConsole())
   vitePlugins.push(createBanner())
+  vitePlugins.push(createDebugTool(viteEnv))
   return vitePlugins
 }