问题背景
在 5.x 版本的 oinone 前端架构中，我们开放了部分源码，但是导致以下性能问题：
1.构建耗时增加：Webpack 需要编译源码文件
2.加载性能下降：页面需加载全部编译产物
3.冷启动缓慢：开发服务器启动时间延长
以下方案通过关闭源码依赖。
操作步骤
1. 添加路径修正脚本
1: 在当前项目工程根目录中的scripts目录添加patch-package-entry.js脚本，内容如下：
const fs = require('fs');
const path = require('path');
const targetPackages = [
'@kunlun+vue-admin-base',
'@kunlun+vue-admin-layout',
'@kunlun+vue-router',
'@kunlun+vue-ui',
'@kunlun+vue-ui-antd',
'@kunlun+vue-ui-common',
'@kunlun+vue-ui-el',
'@kunlun+vue-widget'
];
// 递归查找目标包的 package.json
function findPackageJson(rootDir, pkgName) {
const entries = fs.readdirSync(rootDir);
for (const entry of entries) {
const entryPath = path.join(rootDir, entry);
const stat = fs.statSync(entryPath);
if (stat.isDirectory()) {
if (entry.startsWith(pkgName)) {
const [pkGroupName, name] = pkgName.split('+');
const pkgDir = path.join(entryPath, 'node_modules', pkGroupName, name);
const pkgJsonPath = path.join(pkgDir, 'package.json');
if (fs.existsSync(pkgJsonPath)) {
return pkgJsonPath;
}
}
// 递归查找子目录
const found = findPackageJson(entryPath, pkgName);
if (found) return found;
}
}
return null;
}
// 从 node_modules/.pnpm 开始查找
const pnpmDir = path.join(__dirname, '../', 'node_modules', '.pnpm');
for (const pkgName of targetPackages) {
const packageJsonPath = findPackageJson(pnpmDir, pkgName);
if (packageJsonPath) {
try {
const packageJSON = JSON.parse(fs.readFileSync(packageJsonPath, 'utf8'));
if (packageJSON.main === 'index.ts') {
const libName = packageJSON.name.replace('@', '').replace('/', '-');
packageJSON.main = `dist/${libName}.umd.js`;
packageJSON.module = `dist/${libName}.umd.js`;
const typings = 'dist/types/index.d.ts';
packageJSON.typings = typings;
const [pwd] = packageJsonPath.split('package.json');
const typingsUrl = path.resolve(pwd, typings);
const dir = fs.existsSync(typingsUrl);
if (!dir) {
packageJSON.typings = 'dist/index.d.ts';
}
packageJSON.files = ['dist'];
fs.writeFileSync(packageJsonPath, JSON.stringify(packageJSON, null, 2));
}
} catch (err) {
process.exit(1);
}
}
}
2. 配置自动执行钩子
{
"scripts": {
"postinstall": "node ./scripts/patch-package-entry.js"
}
}脚本作用说明：postinstall 是 npm/pnpm 的生命周期钩子，会在每次执行 npm install 或 pnpm install 后自动触发，确保依赖更新后入口配置保持正确。
3. 重新安装依赖
pnpm installOinone社区 作者：汤乾华原创文章，如若转载，请注明出处：https://doc.oinone.top/frontend/20960.html
访问Oinone官网:https://www.oinone.top获取数式Oinone低代码应用平台体验
