支持build lib生成固定文件名的包和导出js style,避免污染应用层的style
This commit is contained in:
@@ -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",
|
||||
|
||||
39
scripts/generate-css-export.js
Normal file
39
scripts/generate-css-export.js
Normal 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()
|
||||
@@ -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
|
||||
},
|
||||
},
|
||||
},
|
||||
|
||||
Reference in New Issue
Block a user