build: 部分模块改为cdn引入

.storybook/main.ts

@@ -2,31 +2,82 @@
  * @Author: zhaojinfeng 121016171@qq.com
  * @Date: 2023-06-15 13:22:59
  * @LastEditors: zhaojinfeng 121016171@qq.com
- * @LastEditTime: 2023-06-21 11:18:51
+ * @LastEditTime: 2023-08-22 02:38:25
  * @FilePath: \vue3\.storybook\main.ts
- * @Description: 
+ * @Description:
  */
-import type { StorybookConfig } from "@storybook/vue3-vite"
+import type { StorybookConfig } from '@storybook/vue3-vite'
 import Unocss from 'unocss/vite'
+import externalGlobals from 'rollup-plugin-external-globals'
+import { createHtmlPlugin } from 'vite-plugin-html'
+
+const externalGlobalsObj = {
+  'vue': 'Vue',
+  'vue-demi': 'VueDemi',
+  'vue-router': 'VueRouter',
+  'element-plus': 'ElementPlus',
+  // 'react': 'React',
+  // 'react-dom': 'ReactDom',
+  // 'VueOfficeDocx': 'vue-office-docx',
+  // 'VueOfficeExcel': 'vue-office-excel',
+  // 'VueOfficePdf': 'vue-office-pdf',
+}
+
+const cdn = {
+  css: [
+    'https://registry.npmmirror.com/element-plus/2.3.6/dist/index.css',
+  ],
+  js: [
+    // 'https://registry.npmmirror.com/react/18.2.0/files/umd/react.production.min.js',
+    // 'https://registry.npmmirror.com/react-dom/18.2.0/files/umd/react-dom.production.min.js',
+    'https://registry.npmmirror.com/vue/3.2.47/files/dist/vue.global.prod.js',
+    'https://registry.npmmirror.com/vue-demi/0.14.0/files/lib/index.iife.js',
+    'https://registry.npmmirror.com/vue-router/4.1.6/files/dist/vue-router.global.js',
+    'https://registry.npmmirror.com/element-plus/2.3.6/files/dist/index.full.min.js',
+  ],
+}
 
 const config: StorybookConfig = {
-  stories: ["../stories/*.stories.@(js|jsx|ts|tsx)"],
+  stories: ['../stories/*.stories.@(js|jsx|ts|tsx)'],
   addons: [
-    "@storybook/addon-links",
-    "@storybook/addon-essentials",
-    "@storybook/addon-interactions",
+    '@storybook/addon-links',
+    '@storybook/addon-essentials',
+    '@storybook/addon-interactions',
   ],
-  core: {},
   framework: {
-    name: "@storybook/vue3-vite",
+    name: '@storybook/vue3-vite',
     options: {},
   },
   docs: {
-    autodocs: "tag",
+    autodocs: 'tag',
     defaultName: '文档',
   },
   viteFinal(config) {
-    config.plugins?.push(Unocss())
+    const { build, plugins = [] } = config
+    plugins.push(Unocss())
+    if (!config.server) {
+      plugins.push(
+        {
+          ...externalGlobals(externalGlobalsObj),
+          enforce: 'post',
+          apply: 'build',
+        },
+        createHtmlPlugin({
+          minify: true,
+          inject: {
+            tags: [
+              ...cdn.css.map(href => ({ tag: 'link', attrs: { href } })),
+              ...cdn.js.map(src => ({ tag: 'script', attrs: { src } })),
+            ],
+          },
+        }),
+      )
+      if (Array.isArray(build.rollupOptions?.external))
+        build.rollupOptions.external.push(...Object.keys(externalGlobalsObj))
+    }
+
+    config.plugins = plugins
+
     // Add other configuration here depending on your use case
     return config
   },