Skip to content

Commit e9b75c4

Browse files
chilinglingchilingling
committed
fix: optimize local CDN plugin implementation
1 parent b7c548b commit e9b75c4

9 files changed

Lines changed: 87 additions & 84 deletions

File tree

‎packages/build/vite-config/src/default-config.js‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@ import { getBaseUrlFromCli, copyBundleDeps, localCdnPlugin } from './localCdnFil
1414
import { devAliasPlugin } from './vite-plugins/devAliasPlugin.js'
1515
import { htmlUpgradeHttpsPlugin } from './vite-plugins/upgradeHttpsPlugin.js'
1616
import { canvasDevExternal } from './canvas-dev-external.js'
17+
import { createDynamicImportMapPlugin } from './vite-plugins/createDynamicImportMapPlugin.js'
1718

1819
const monacoEditorPlugin = monacoEditorPluginCjs.default
1920
const nodeGlobalsPolyfillPlugin = nodeGlobalsPolyfillPluginCjs.default
@@ -179,6 +180,14 @@ export function useTinyEngineBaseConfig(engineConfig) {
179180
}
180181
}
181182

183+
config.plugins.push(
184+
createDynamicImportMapPlugin({
185+
base: getBaseUrlFromCli(config.base),
186+
cdnDir: 'local-cdn-static',
187+
isLocalImportMap
188+
})
189+
)
190+
182191
config.plugins.push(devAliasPlugin(env, engineConfig.useSourceAlias))
183192

184193
if (engineConfig.useSourceAlias && command === 'serve') {

‎packages/build/vite-config/src/localCdnFile/import-map.js‎

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
export const importMapConfig = {
2+
imports: {
3+
vue: '${VITE_CDN_DOMAIN}/vue${versionDelimiter}3.4.23${fileDelimiter}/dist/vue.runtime.esm-browser.js',
4+
'vue/server-renderer':
5+
'${VITE_CDN_DOMAIN}/@vue/server-renderer${versionDelimiter}3.4.23${fileDelimiter}/dist/server-renderer.esm-browser.js',
6+
'vue-i18n': '${VITE_CDN_DOMAIN}/vue-i18n${versionDelimiter}^9.9.0${fileDelimiter}/dist/vue-i18n.esm-browser.js',
7+
'vue-router':
8+
'${VITE_CDN_DOMAIN}/vue-router${versionDelimiter}4.0.16${fileDelimiter}/dist/vue-router.esm-browser.js',
9+
'@vue/devtools-api':
10+
'${VITE_CDN_DOMAIN}/@vue/devtools-api${versionDelimiter}6.5.1${fileDelimiter}/lib/esm/index.js',
11+
'@vueuse/core': '${VITE_CDN_DOMAIN}/@vueuse/core${versionDelimiter}9.6.0${fileDelimiter}/index.mjs',
12+
'@vueuse/shared': '${VITE_CDN_DOMAIN}/@vueuse/shared${versionDelimiter}9.6.0${fileDelimiter}/index.mjs',
13+
axios: '${VITE_CDN_DOMAIN}/axios${versionDelimiter}1.0.0${fileDelimiter}/dist/esm/axios.js',
14+
'@opentiny/tiny-engine-webcomponent-core':
15+
'${VITE_CDN_DOMAIN}/@opentiny/tiny-engine-webcomponent-core${versionDelimiter}1${fileDelimiter}/dist/tiny-engine-webcomponent-core.es.js',
16+
'@opentiny/tiny-engine-i18n-host':
17+
'${VITE_CDN_DOMAIN}/@opentiny/tiny-engine-i18n-host${versionDelimiter}1${fileDelimiter}/dist/lowcode-design-i18n-host.es.js',
18+
'@opentiny/tiny-engine-builtin-component':
19+
'${VITE_CDN_DOMAIN}/@opentiny/tiny-engine-builtin-component${versionDelimiter}^2.0.0${fileDelimiter}/dist/index.mjs',
20+
'vue-demi': '${VITE_CDN_DOMAIN}/vue-demi${versionDelimiter}0.13.11${fileDelimiter}/lib/index.mjs',
21+
pinia: '${VITE_CDN_DOMAIN}/pinia${versionDelimiter}2.0.22${fileDelimiter}/dist/pinia.esm-browser.js',
22+
'@opentiny/vue':
23+
'${VITE_CDN_DOMAIN}/@opentiny/vue-runtime${versionDelimiter}~3.20${fileDelimiter}/dist3/tiny-vue-pc.mjs',
24+
'@opentiny/vue-icon':
25+
'${VITE_CDN_DOMAIN}/@opentiny/vue-runtime${versionDelimiter}~3.20${fileDelimiter}/dist3/tiny-vue-icon.mjs',
26+
'@opentiny/vue-common':
27+
'${VITE_CDN_DOMAIN}/@opentiny/vue-runtime${versionDelimiter}~3.20${fileDelimiter}/dist3/tiny-vue-common.mjs',
28+
'@opentiny/vue-locale':
29+
'${VITE_CDN_DOMAIN}/@opentiny/vue-runtime${versionDelimiter}~3.20${fileDelimiter}/dist3/tiny-vue-locale.mjs',
30+
'@opentiny/vue-renderless/': '${VITE_CDN_DOMAIN}/@opentiny/vue-renderless${versionDelimiter}~3.20${fileDelimiter}/',
31+
echarts: '${VITE_CDN_DOMAIN}/echarts${versionDelimiter}5.4.1${fileDelimiter}/dist/echarts.esm.js'
32+
}
33+
}

‎packages/build/vite-config/src/localCdnFile/localCdnPlugin.js‎

Lines changed: 2 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
import path from 'node:path'
22
import fs from 'fs-extra'
33
import { installPackageTemporary } from '../vite-plugins/installPackageTemporary.js'
4-
import { createEnvReplacementPlugin } from '../vite-plugins/createEnvReplacementPlugin.js'
54
import { copyPlugin } from '../vite-plugins/cdnCopyPlugin.js'
65
import { dedupeCopyFiles } from './locateCdnNpmInfo.js'
6+
import { importMapConfig as importMapConfigFile } from './import-map.js'
77

88
const logger = console
99

@@ -156,10 +156,7 @@ export function localCdnPlugin({
156156
}) {
157157
const importMapConfig = localCdnConfig.importMap || { imports: {} }
158158
const copyConfig = localCdnConfig.copy || {}
159-
160-
const defaultImportMapConfig = JSON.parse(
161-
fs.readFileSync(path.resolve(process.cwd(), './node_modules/@opentiny/tiny-engine/dist/import-map.json'), 'utf-8')
162-
)
159+
const defaultImportMapConfig = importMapConfigFile
163160
const parsedDefaultImportMapConfig = Object.values(defaultImportMapConfig.imports).map((item) => extractInfo(item))
164161
const parsedImportMapConfig = Object.values(importMapConfig.imports).map((item) => extractInfo(item))
165162
const overriddenImportMap = parsedDefaultImportMapConfig.filter((item) => {
@@ -199,8 +196,6 @@ export function localCdnPlugin({
199196
const targetFiles = dedupeCopyFiles(cdnFiles)
200197
// 返回插件数组
201198
return [
202-
// 创建环境变量替换插件，替换CDN域名为本地路径
203-
createEnvReplacementPlugin(cdnDir, base),
204199
// 安装需要的包
205200
...installPackageTemporary(packageNeedToInstall, bundleTempDir),
206201
// 使用自定义的copyPlugin替代直接调用copy

‎packages/build/vite-config/src/vite-plugins/createDynamicImportMapPlugin.js‎

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
import { importMapConfig } from '../localCdnFile/import-map.js'
2+
3+
/**
4+
* 创建环境变量替换插件
5+
* @param {string} cdnDir - 本地CDN目录名
6+
* @param {string} base - 基础路径
7+
* @param {boolean} isLocalImportMap - 是否是本地CDN
8+
* @returns {Object} - Vite插件对象
9+
*/
10+
export function createDynamicImportMapPlugin({ cdnDir, base, isLocalImportMap = false }) {
11+
const virtualModuleId = 'virtual:import-map'
12+
const resolvedVirtualModuleId = '\0' + virtualModuleId
13+
14+
return {
15+
name: 'vite-plugin-dynamic-import-map',
16+
resolveId(id) {
17+
if (id === virtualModuleId) {
18+
return resolvedVirtualModuleId
19+
}
20+
},
21+
load(id) {
22+
if (id === resolvedVirtualModuleId) {
23+
if (isLocalImportMap) {
24+
const cdnDomain = `${base.endsWith('/') ? base : base + '/'}${cdnDir}`
25+
const newContent = JSON.stringify(importMapConfig)
26+
.replaceAll(/\${VITE_CDN_DOMAIN}/g, cdnDomain)
27+
.replaceAll(/\${versionDelimiter}/g, '@')
28+
.replaceAll(/\${fileDelimiter}/g, '')
29+
30+
return `export default ${newContent}`
31+
}
32+
33+
return `export default ${JSON.stringify(importMapConfig)}`
34+
}
35+
}
36+
}
37+
}

‎packages/build/vite-config/src/vite-plugins/createEnvReplacementPlugin.js‎

Lines changed: 0 additions & 22 deletions
This file was deleted.

‎packages/common/js/importMap/import-map.json‎

Lines changed: 0 additions & 23 deletions
This file was deleted.

‎packages/common/js/importMap/index.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
export { default as importMapConfig } from './import-map.json'
1+
export { default as importMapConfig } from 'virtual:import-map'

‎packages/common/vite.config.ts‎

Lines changed: 3 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -17,28 +17,14 @@ import vueJsx from '@vitejs/plugin-vue-jsx'
1717
import { glob } from 'glob'
1818
import { fileURLToPath } from 'node:url'
1919
import generateComments from '@opentiny/tiny-engine-vite-plugin-meta-comments'
20-
import { viteStaticCopy } from 'vite-plugin-static-copy'
2120

2221
const jsEntries = glob.sync('./js/**/*.js').map((file) => {
2322
return [file.slice(0, file.length - path.extname(file).length), fileURLToPath(new URL(file, import.meta.url))]
2423
})
2524

2625
// https://vitejs.dev/config/
2726
export default defineConfig({
28-
plugins: [
29-
generateComments(),
30-
vue(),
31-
vueJsx(),
32-
// 复制 import-map.json到产物，提供给构建插件读取
33-
viteStaticCopy({
34-
targets: [
35-
{
36-
src: './js/importMap/import-map.json',
37-
dest: '.'
38-
}
39-
]
40-
})
41-
],
27+
plugins: [generateComments(), vue(), vueJsx()],
4228
publicDir: false,
4329
resolve: {},
4430
base: './',
@@ -80,7 +66,8 @@ export default defineConfig({
8066
/@opentiny\/tiny-engine.*/,
8167
/@opentiny\/vue.*/,
8268
/^prettier.*/,
83-
/^@babel.*/
69+
/^@babel.*/,
70+
/^virtual:import-map$/
8471
]
8572
}
8673
}

‎packages/design-core/vite.config.js‎

Lines changed: 2 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,6 @@ import nodeGlobalsPolyfillPluginCjs from '@esbuild-plugins/node-globals-polyfill
66
import nodeModulesPolyfillPluginCjs from '@esbuild-plugins/node-modules-polyfill'
77
import nodePolyfill from 'rollup-plugin-polyfill-node'
88
import { fileURLToPath } from 'node:url'
9-
import { viteStaticCopy } from 'vite-plugin-static-copy'
109

1110
const nodeGlobalsPolyfillPlugin = nodeGlobalsPolyfillPluginCjs.default
1211
const nodeModulesPolyfillPlugin = nodeModulesPolyfillPluginCjs.default
@@ -15,19 +14,7 @@ const __filename = fileURLToPath(import.meta.url)
1514
const __dirname = path.dirname(__filename)
1615

1716
export default defineConfig({
18-
plugins: [
19-
vue(),
20-
vueJsx(),
21-
// 复制 import-map.json到产物，提供给构建插件读取
22-
viteStaticCopy({
23-
targets: [
24-
{
25-
src: './node_modules/@opentiny/tiny-engine-common/dist/import-map.json',
26-
dest: '.'
27-
}
28-
]
29-
})
30-
],
17+
plugins: [vue(), vueJsx()],
3118
publicDir: false,
3219
optimizeDeps: {
3320
esbuildOptions: {
@@ -75,7 +62,7 @@ export default defineConfig({
7562
}
7663
}
7764
},
78-
external: ['vue', 'monaco-editor', 'prettier', /@opentiny\/vue.*/, '@opentiny/tiny-engine-meta-register']
65+
external: ['vue', 'monaco-editor', 'prettier', /@opentiny\/vue.*/, /^@opentiny\/tiny-engine*/]
7966
}
8067
}
8168
})

0 commit comments

Comments
 (0)