72 lines
2.9 KiB
TypeScript
72 lines
2.9 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'],
|
||
// 选项名是 outDirs(复数)。旧写法 outDir 会被**静默忽略** —— vue-tsc 就是从这条报错里抓出来的。
|
||
outDirs: 'dist',
|
||
// 刻意不打包成单个 d.ts:那需要 bundleTypes(旧名 rollupTypes,v5 已不存在)
|
||
// 外加 @microsoft/api-extractor(peerDependency,当前未安装)。
|
||
// 现产物 = 逐文件 d.ts + dist/index.d.ts(barrel),与 package.json 的 exports.types 对得上。
|
||
}),
|
||
],
|
||
define: {
|
||
__G3_NAMESPACE__: JSON.stringify(NAMESPACE),
|
||
__G3_STATE_PREFIX__: JSON.stringify(STATE_PREFIX),
|
||
},
|
||
// 组件 SCSS 由 Vite 自带的 modern compiler API 编译 —— v6 起它是唯一实现,
|
||
// `css.preprocessorOptions.scss.api` 选项已被移除,再写只会是一条不生效的多余配置
|
||
// (vue-tsc 会直接报 TS2769)。库自身只用默认 $namespace,不加 additionalData。
|
||
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',
|
||
},
|
||
},
|
||
},
|
||
})
|