支持build lib生成固定文件名的包和导出js style,避免污染应用层的style

This commit is contained in:
qiuchengw
2025-09-25 11:26:37 +08:00
parent 69ec4df7da
commit 185c6047cc
3 changed files with 58 additions and 2 deletions

View File

@@ -50,7 +50,7 @@
"dev:demo": "vite",
"build": "vue-tsc -b && vite build",
"build:demo": "vue-tsc -b && vite build",
"build:lib": "vite build --config vite.config.lib.ts",
"build:lib": "vite build --config vite.config.lib.ts && node scripts/generate-css-export.js",
"preview": "vite preview",
"lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix",
"lint:check": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts",

View File

@@ -0,0 +1,39 @@
#!/usr/bin/env node
import fs from 'fs'
import path from 'path'
import { fileURLToPath } from 'url'
// ES模块中的__dirname等价物
const __filename = fileURLToPath(import.meta.url)
const __dirname = path.dirname(__filename)
// 构建后生成CSS导出文件
function generateCssExport() {
const distDir = path.resolve(__dirname, '../npm-package/dist')
const cssFile = path.join(distDir, 'assets/jordium-gantt-vue3.css')
const outputFile = path.join(distDir, 'jordium-gantt-vue3-styles.js')
try {
if (fs.existsSync(cssFile)) {
const cssContent = fs.readFileSync(cssFile, 'utf8')
// 生成JS导出文件
const jsContent = `// CSS styles for jordium-gantt-vue3
// Auto-generated file - do not edit manually
export const ganttStyles = ${JSON.stringify(cssContent)}
export default ganttStyles
`
fs.writeFileSync(outputFile, jsContent, 'utf8')
console.log('✅ Generated CSS export file:', outputFile)
} else {
console.warn('⚠️ CSS file not found:', cssFile)
}
} catch (error) {
console.error('❌ Failed to generate CSS export:', error)
process.exit(1)
}
}
// 运行
generateCssExport()

View File

@@ -1,9 +1,19 @@
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
// 生成CSS导出文件的插件
const generateCssExportPlugin = () => {
return {
name: 'generate-css-export',
generateBundle() {
// 此插件将在构建后脚本中处理
}
}
}
// https://vite.dev/config/
export default defineConfig({
plugins: [vue()],
plugins: [vue(), generateCssExportPlugin()],
build: {
outDir: './npm-package/dist',
emptyOutDir: true,
@@ -21,6 +31,13 @@ export default defineConfig({
globals: {
vue: 'Vue',
},
// 禁用文件名哈希,生成固定文件名
entryFileNames: 'jordium-gantt-vue3.[format].js',
chunkFileNames: 'chunks/[name].js',
assetFileNames: 'assets/[name].[ext]',
// 禁用代码分割,将所有代码打包到一个文件中
manualChunks: undefined,
inlineDynamicImports: true
},
},
},