kintone-plugins/kintone-vue-template
Template
1
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactoring

Browse Source
This commit is contained in:
薛家豪
2025-10-17 14:34:26 +08:00
parent 8e40f9f0e6
commit 7ddaeb4bf8
16 changed files with 339 additions and 265 deletions
Download Patch File Download Diff File Expand all files Collapse all files

82
vite.config.ts
View File

@@ -1,33 +1,35 @@
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import copy from "rollup-plugin-copy";
import { defineConfig } from 'vite';
import vue from '@vitejs/plugin-vue';
import copy from 'rollup-plugin-copy';
import * as path from 'path';
import * as fs from 'fs';
import * as child_process from 'child_process';
import Components from 'unplugin-vue-components/vite';
import RSA from 'node-rsa';
// Read kintone-ui-component version from package.json
// 从 package.json 读取 kintone-ui-component 版本信息
const packageJson = JSON.parse(fs.readFileSync(path.resolve(__dirname, 'package.json'), 'utf-8'));
const kucVersion = packageJson.dependencies['kintone-ui-component'];
const formattedVersion = kucVersion.replace(/\./g, '-'); // e.g., 1.22.0 -> 1-22-0
const dottedVersion = kucVersion; // e.g., 1.22.0 -> 1.22.0
const formattedVersion = kucVersion.replace(/\./g, '-'); // 例如：1.22.0 -> 1-22-0
/**
* Create a private key for a kintone plugin
* 生成 kintone 插件的私钥
*/
export const generatePrivateKey = () => {
const key = new RSA({ b: 1024 });
return key.exportKey("pkcs1-private");
return key.exportKey('pkcs1-private');
};
// Check if private.ppk exists, if not, generate it
// 检查 private.ppk 是否存在，如果不存在则生成
const privateKeyPath = path.resolve(__dirname, 'private.ppk');
if (!fs.existsSync(privateKeyPath)) {
const privateKey = generatePrivateKey();
fs.writeFileSync(privateKeyPath, privateKey);
}
/**
* 自定义插件 vite-plugin-replace-tags：替换 KUC 组件标签为包含版本号的标签，并自动导入组件
*/
function replaceKucTagsPlugin() {
return {
name: 'vite-plugin-replace-tags',
@@ -35,24 +37,28 @@ function replaceKucTagsPlugin() {
if (id.endsWith('.vue')) {
const content = await fs.promises.readFile(id, 'utf-8');
const usedComponent = {}
const usedComponent = {};
// 替换 <kuc-*> 为带有版本号的形式 <kuc-[version]-*>
let res = content
.replace(new RegExp(`</kuc-([a-zA-Z0-9-]+)(?![0-9-])>`, 'g'), (match, p1) => `</kuc-${p1}-${formattedVersion}>`)
.replace(new RegExp(`<kuc-([a-zA-Z0-9-]+)(?![0-9-])([^>]*)>`, 'g'), (match, p1, p2) => {
usedComponent[p1] = true;
return `<kuc-${p1}-${formattedVersion}${p2}>`
return `<kuc-${p1}-${formattedVersion}${p2}>`;
});
// 如果有 KUC 组件，自动生成 import 脚本
if (Object.keys(usedComponent).length) {
let importScript = '<script lang="ts">'
let importScript = '<script lang="ts">';
Object.keys(usedComponent).forEach((key) => {
const keyPascal = key.split('-')
.map(word => word.charAt(0).toUpperCase() + word.slice(1))
.map((word) => word.charAt(0).toUpperCase() + word.slice(1))
.join('');
// 特殊处理 multi-choice 组件名称
if (key === 'multi-choice') {
key = 'multichoice';
}
importScript += `import * as Kuc${keyPascal} from "kintone-ui-component/lib/${key}";`
importScript += `import * as Kuc${keyPascal} from "kintone-ui-component/lib/${key}";`;
});
importScript += '</script>';
res = importScript + res;
@@ -60,11 +66,13 @@ function replaceKucTagsPlugin() {
return res;
}
}
},
};
}
// Function to build IIFE versions of desktop and mobile scripts
/**
* 自定义插件 iife-builder：构建 desktop.ts 和 mobile.ts 的 IIFE 版本
*/
function buildIIFEVersions() {
return {
name: 'iife-builder',
@@ -87,9 +95,9 @@ function buildIIFEVersions() {
}
},
generateBundle(options, bundle) {
// Copy and overwrite the main dist/src/js files with IIFE versions
const desktopIIFEPath = path.resolve(__dirname, 'dist-temp/desktop/desktop.js');
const mobileIIFEPath = path.resolve(__dirname, 'dist-temp/mobile/mobile.js');
// 将 IIFE 版本复制到主构建目录覆盖原有文件
const desktopIIFEPath = path.resolve(__dirname, 'dist-iife/desktop/desktop.js');
const mobileIIFEPath = path.resolve(__dirname, 'dist-iife/mobile/mobile.js');
const destDir = path.resolve(__dirname, 'dist/src/js');
if (fs.existsSync(desktopIIFEPath)) {
@@ -104,12 +112,12 @@ function buildIIFEVersions() {
console.log('Copied mobile.js to dist/src/js/');
}
// Clean up dist-temp directory
if (fs.existsSync(path.resolve(__dirname, 'dist-temp'))) {
fs.rmSync(path.resolve(__dirname, 'dist-temp'), { recursive: true, force: true });
console.log('Cleaned up dist-temp directory');
// 清理临时的 dist-iife 目录
if (fs.existsSync(path.resolve(__dirname, 'dist-iife'))) {
fs.rmSync(path.resolve(__dirname, 'dist-iife'), { recursive: true, force: true });
console.log('Cleaned up dist-iife directory');
}
}
},
};
}
@@ -120,12 +128,14 @@ export default defineConfig({
vue({
template: {
compilerOptions: {
isCustomElement: (tag) => tag.startsWith("kuc-"),
}
}
// 将以 kuc- 开头的标签识别为自定义元素，避免 Vue 的警告
isCustomElement: (tag) => tag.startsWith('kuc-'),
},
},
}),
Components(),
Components(), // 自动导入 Vue 组件
copy({
// 将打包 plugin 需要的文件复制到 dist 里面
targets: [
{ src: 'dist/index.html', dest: 'dist/src/html', rename: 'config.html' },
{ src: 'src/manifest.json', dest: 'dist/src' },
@@ -136,11 +146,11 @@ export default defineConfig({
],
hook: 'writeBundle' // 指定在何时复制文件
}),
replaceKucTagsPlugin()
replaceKucTagsPlugin(), // 自定义标签替换插件
],
resolve: {
alias: {
'@': path.resolve(__dirname, 'src'),
'@': path.resolve(__dirname, 'src'), // 配置 @ 别名指向 src 目录
},
},
build: {
@@ -150,15 +160,11 @@ export default defineConfig({
},
output: {
entryFileNames: (chunkInfo) => {
return 'src/js/[name].js'; // 默认处理为 JS 文件
return 'src/js/[name].js'; // 将入口文件输出为 JS 文件
},
assetFileNames: 'src/[ext]/[name].[ext]',
assetFileNames: 'src/[ext]/[name].[ext]', // 设置资源文件输出路径
},
},
sourcemap: 'inline',
sourcemap: 'inline', // 生成内联 sourcemap 用于调试
},
define: {
KUC_VERSION: JSON.stringify(dottedVersion),
KUC_VERSION_DASHED: JSON.stringify(formattedVersion)
}
})
});