mirror of
https://github.com/Powerful-517/yys-editor.git
synced 2026-03-05 06:55:26 +00:00
feat: 完成组件化改造 - 支持作为可嵌入组件使用
- 创建 YysEditorEmbed.vue 嵌入式组件 - 实现 preview/edit 双模式 - 配置 Vite library mode 构建 - 生成 ES Module + UMD + CSS 构建产物 - 完善设计文档和使用文档 - 更新 plan.md 标记阶段 2 完成 构建产物: - dist/yys-editor.es.js (155KB, gzip: 35KB) - dist/yys-editor.umd.js (112KB, gzip: 31KB) - dist/yys-editor.css (69KB, gzip: 33KB) 相关文档: - docs/2design/ComponentArchitecture.md - docs/3build/YysEditorEmbed.md - docs/3build/EMBED_README.md - docs/4test/BUILD_TEST_REPORT.md
This commit is contained in:
69
vite.config.lib.js
Normal file
69
vite.config.lib.js
Normal file
@@ -0,0 +1,69 @@
|
||||
import { fileURLToPath, URL } from 'node:url'
|
||||
import { defineConfig } from 'vite'
|
||||
import vue from '@vitejs/plugin-vue'
|
||||
import path from 'path'
|
||||
|
||||
// https://vitejs.dev/config/
|
||||
export default defineConfig({
|
||||
plugins: [
|
||||
vue({
|
||||
template: {
|
||||
compilerOptions: {
|
||||
isCustomElement: (tag) => tag.startsWith('lf-')
|
||||
}
|
||||
}
|
||||
})
|
||||
],
|
||||
resolve: {
|
||||
alias: {
|
||||
'@': fileURLToPath(new URL('./src', import.meta.url))
|
||||
}
|
||||
},
|
||||
build: {
|
||||
lib: {
|
||||
// 入口文件 - 创建一个入口文件而不是直接使用 .vue 文件
|
||||
entry: path.resolve(__dirname, 'src/index.js'),
|
||||
name: 'YysEditor',
|
||||
// 输出文件名
|
||||
fileName: (format) => `yys-editor.${format}.js`,
|
||||
formats: ['es', 'umd']
|
||||
},
|
||||
rollupOptions: {
|
||||
// 外部化依赖(不打包进库)
|
||||
external: [
|
||||
'vue',
|
||||
'element-plus',
|
||||
'pinia',
|
||||
'@logicflow/core',
|
||||
'@logicflow/extension',
|
||||
'@logicflow/vue-node-registry',
|
||||
'@element-plus/icons-vue',
|
||||
'@vueup/vue-quill',
|
||||
'vue3-draggable-resizable',
|
||||
'vuedraggable',
|
||||
'html2canvas',
|
||||
'vue-i18n'
|
||||
],
|
||||
output: {
|
||||
// 全局变量名
|
||||
globals: {
|
||||
vue: 'Vue',
|
||||
'element-plus': 'ElementPlus',
|
||||
pinia: 'Pinia',
|
||||
'@logicflow/core': 'LogicFlow',
|
||||
'@logicflow/extension': 'LogicFlowExtension',
|
||||
'@logicflow/vue-node-registry': 'LogicFlowVueNodeRegistry'
|
||||
},
|
||||
// 导出 CSS
|
||||
assetFileNames: (assetInfo) => {
|
||||
if (assetInfo.name === 'style.css') return 'yys-editor.css'
|
||||
return assetInfo.name
|
||||
}
|
||||
}
|
||||
},
|
||||
// 生成 sourcemap
|
||||
sourcemap: true,
|
||||
// 清空输出目录
|
||||
emptyOutDir: false
|
||||
}
|
||||
})
|
||||
Reference in New Issue
Block a user