Files
esengine/packages/tilemap/vite.config.ts
YHH 359886c72f Feature/physics and tilemap enhancement (#247)
* feat(behavior-tree,tilemap): 修复编辑器连线缩放问题并增强插件系统

* feat(node-editor,blueprint): 新增通用节点编辑器和蓝图可视化脚本系统

* feat(editor,tilemap): 优化编辑器UI样式和Tilemap编辑器功能

* fix: 修复CodeQL安全警告和CI类型检查错误

* fix: 修复CodeQL安全警告和CI类型检查错误

* fix: 修复CodeQL安全警告和CI类型检查错误
2025-11-29 23:00:48 +08:00

111 lines
3.9 KiB
TypeScript
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
import { defineConfig } from 'vite';
import { resolve } from 'path';
import dts from 'vite-plugin-dts';
import react from '@vitejs/plugin-react';
/**
* 自定义插件:将 CSS 转换为自执行的样式注入代码
* Custom plugin: Convert CSS to self-executing style injection code
*
* 当用户写 `import './styles.css'` 时,这个插件会:
* 1. 在构建时将 CSS 内容转换为 JS 代码
* 2. JS 代码在模块导入时自动执行,将样式注入到 DOM
* 3. 使用唯一 ID 防止重复注入
*
* When user writes `import './styles.css'`, this plugin will:
* 1. Convert CSS content to JS code during build
* 2. JS code auto-executes when module is imported, injecting styles to DOM
* 3. Uses unique ID to prevent duplicate injection
*/
function injectCSSPlugin(): any {
const cssIdMap = new Map<string, string>();
let cssCounter = 0;
return {
name: 'inject-css-plugin',
enforce: 'post' as const,
generateBundle(_options: any, bundle: any) {
const bundleKeys = Object.keys(bundle);
// 找到所有 CSS 文件
const cssFiles = bundleKeys.filter(key => key.endsWith('.css'));
for (const cssFile of cssFiles) {
const cssChunk = bundle[cssFile];
if (!cssChunk || !cssChunk.source) continue;
const cssContent = cssChunk.source;
const styleId = `esengine-tilemap-style-${cssCounter++}`;
cssIdMap.set(cssFile, styleId);
// 生成样式注入代码
const injectCode = `(function(){if(typeof document!=='undefined'){var s=document.createElement('style');s.id='${styleId}';if(!document.getElementById(s.id)){s.textContent=${JSON.stringify(cssContent)};document.head.appendChild(s);}}})();`;
// 找到引用此 CSS 的 JS chunk 并注入代码
for (const jsKey of bundleKeys) {
if (!jsKey.endsWith('.js')) continue;
const jsChunk = bundle[jsKey];
if (!jsChunk || jsChunk.type !== 'chunk' || !jsChunk.code) continue;
// 检查是否引用了这个 CSS通过检查是否有相关的 import
// 对于 vite 生成的代码CSS 导入会被转换,所以我们直接注入到 editor/index.js
if (jsKey === 'editor/index.js' || jsKey.match(/^index-[^/]+\.js$/)) {
jsChunk.code = injectCode + '\n' + jsChunk.code;
}
}
// 删除独立的 CSS 文件
delete bundle[cssFile];
}
}
};
}
export default defineConfig({
plugins: [
react(),
dts({
include: ['src'],
outDir: 'dist',
rollupTypes: false
}),
injectCSSPlugin()
],
esbuild: {
jsx: 'automatic',
},
build: {
lib: {
entry: {
index: resolve(__dirname, 'src/index.ts'),
runtime: resolve(__dirname, 'src/runtime.ts'),
'editor/index': resolve(__dirname, 'src/editor/index.ts')
},
formats: ['es'],
fileName: (format, entryName) => `${entryName}.js`
},
rollupOptions: {
external: [
'@esengine/ecs-framework',
'@esengine/ecs-components',
'@esengine/ecs-engine-bindgen',
'@esengine/asset-system',
'@esengine/editor-core',
'react',
'react/jsx-runtime',
'lucide-react',
'zustand',
/^@esengine\//,
/^@tauri-apps\//
],
output: {
exports: 'named',
preserveModules: false
}
},
target: 'es2020',
minify: false,
sourcemap: true
}
});