1、通过创建自定义事件CustomEvent(),向js文件传递数据;
当遇到封装了插件需要引入到各系统中,但又因为代码框架版本不同,需要传入自定义配置or字段,可考虑以下方法。
// 创建一个自定义事件
const tokenReadyEvent = new CustomEvent('zonst-token-ready', {
detail: {
message: token,
extraParams: {
switchSystemDrawerWidth: 250, // drawer偏移的宽度
},
},
})
document.dispatchEvent(tokenReadyEvent) // 发送自定义事件
// 接收
document.addEventListener('zonst-token-ready', function(event: any) {
// 监听token变化传入
localStorage.setItem('TOKEN_NAME_SOLID', event.detail.message)
localStorage.setItem('extraParams',
})
2、vite build打包tsx文件为js库时
export default defineConfig({
...
build: {
lib: {
entry: "src/components/xxxxx.tsx", // 要打包的文件路径
name: "xxxx", // 变量名
formats: ["umd"], // 格式,默认[es, umd]
fileName: (format) => `name.${format}.js`, // 输出的文件名
},
sourcemap: true // 构建后是否生成 source map
},
...
})
"scripts": {
"dev": "vite",
"build": "tsc && vite build",
...
}