74 lines
2.4 KiB
TypeScript
74 lines
2.4 KiB
TypeScript
import { readFileSync } from 'node:fs'
|
|
import { fileURLToPath } from 'node:url'
|
|
import vue from '@vitejs/plugin-vue'
|
|
import { defineConfig } from 'vite'
|
|
import dts from 'vite-plugin-dts'
|
|
|
|
// 命名空间单一事实源在 @g3soft/tokens 的 SCSS 里(SCSS 无法读 JS,故 JS 向 SCSS 取)。
|
|
// 这里烘焙成 JS 常量 __G3_NAMESPACE__:运行时 useNamespace() 的默认值 + dev 一致性校验都用它。
|
|
// 消费方若用自定义 $namespace 重编译,需在自身构建里同步 define 同名常量(见 README)。
|
|
const configScssPath = fileURLToPath(
|
|
new URL('../tokens/src/scss/_config.scss', import.meta.url),
|
|
)
|
|
const configScss = readFileSync(configScssPath, 'utf-8')
|
|
|
|
function readScssDefault(name: string, fallback: string): string {
|
|
const match = configScss.match(
|
|
new RegExp(`\\$${name}\\s*:\\s*['"]([^'"]+)['"]\\s*!default`),
|
|
)
|
|
return match ? match[1] : fallback
|
|
}
|
|
|
|
const NAMESPACE = readScssDefault('namespace', 'g3')
|
|
const STATE_PREFIX = readScssDefault('state-prefix', 'is')
|
|
|
|
/**
|
|
* 组件库构建:产出 ESM + 类型声明。
|
|
*
|
|
* 关键点:
|
|
* - vue 必须外置(external),否则包里会打进一份 Vue,消费方出现双实例
|
|
* - preserveModules 保留源码结构,消费方能按需 tree-shaking
|
|
* - vite-plugin-dts 生成 dist/index.d.ts,配合 package.json 的 exports.types
|
|
* - define.__G3_NAMESPACE__ 把编译期命名空间烘焙进 JS,供运行时 useNamespace 使用
|
|
*/
|
|
export default defineConfig({
|
|
plugins: [
|
|
vue(),
|
|
dts({
|
|
// 只产出声明文件,JS 交给 vite 本体
|
|
include: ['src'],
|
|
outDir: 'dist',
|
|
rollupTypes: true,
|
|
}),
|
|
],
|
|
define: {
|
|
__G3_NAMESPACE__: JSON.stringify(NAMESPACE),
|
|
__G3_STATE_PREFIX__: JSON.stringify(STATE_PREFIX),
|
|
},
|
|
css: {
|
|
preprocessorOptions: {
|
|
// 组件 SCSS 一律走 modern compiler API;库自身只用默认 $namespace,不加 additionalData。
|
|
scss: {
|
|
api: 'modern-compiler',
|
|
},
|
|
},
|
|
},
|
|
build: {
|
|
lib: {
|
|
entry: fileURLToPath(new URL('./src/index.ts', import.meta.url)),
|
|
formats: ['es'],
|
|
fileName: () => 'index.js',
|
|
},
|
|
rollupOptions: {
|
|
// 图标库同理外置:由消费方(或本包的 dependencies)解析,避免重复打包
|
|
external: ['vue', '@lucide/vue'],
|
|
output: {
|
|
preserveModules: true,
|
|
preserveModulesRoot: 'src',
|
|
entryFileNames: '[name].js',
|
|
assetFileNames: 'style.css',
|
|
},
|
|
},
|
|
},
|
|
})
|