electron-vite_20配置依赖包运行时区外部加载commonjsExternals_vite-plugin-commonjs-externals

前端进阶者2025-08-25 11:44

Electron 项目中使用 electron-vite(Vite的Electron 构建工具)时的配置文件，告诉 Vite哪些依赖(包)在打包时不用一起打包，而是运行时让Electron去外部加载;

依赖插件vite-plugin-commonjs-externals

1.项目中版本package.json

json 复制代码

"devDependencies":{
	"vite-plugin-commonjs-externals": "^0.1.4",
}

2.安装

typescript 复制代码

npm i vite-plugin-commonjs-externals -D

3.引入electron.vite.config.ts 文件

typescript 复制代码

import commonjsExternals from 'vite-plugin-commonjs-externals';

4.使用electron.vite.config.ts

typescript 复制代码

const commonjsPackages = [
  'dingrtc-electron-sdk',
] as const;

export default defineConfig({
	main:{},
	preload:{},
	renderer:{
		plugins:[
			commonjsExternals({ externals: commonjsPackages }),
		]
	},
});

编译后路径

typescript 复制代码

// win电脑右键图标=>属性=>打开文件所在的位置;
// mac公司没有mac有的兄弟可以评论区告诉我怎么弄;
resources/app.asar.unpacked/node_modules/dingrtc-electron-sdk