mirror of
https://github.com/electron-vite/electron-vite-vue
synced 2025-01-31 12:06:40 +08:00
103 lines
3.0 KiB
TypeScript
103 lines
3.0 KiB
TypeScript
import { join } from 'path'
|
||
import { builtinModules } from 'module'
|
||
import { defineConfig } from 'vite-plugin-electron'
|
||
import resolve, { lib2esm } from 'vite-plugin-resolve'
|
||
import pkg from './package.json'
|
||
|
||
// @ts-ignore
|
||
const dependencies = Object.keys(pkg.dependencies || {})
|
||
|
||
const external = [
|
||
'electron',
|
||
...builtinModules,
|
||
// (🎯-①): For use Node.js package in Electron-Main, Preload-Script
|
||
...dependencies,
|
||
]
|
||
|
||
export default defineConfig({
|
||
main: {
|
||
entry: 'electron/main/index.ts',
|
||
vite: {
|
||
build: {
|
||
sourcemap: false,
|
||
outDir: 'dist/electron/main',
|
||
rollupOptions: {
|
||
external,
|
||
},
|
||
},
|
||
},
|
||
},
|
||
preload: {
|
||
input: {
|
||
// You can configure multiple preload here
|
||
splash: join(__dirname, 'electron/preload/splash.ts'),
|
||
},
|
||
vite: {
|
||
build: {
|
||
// For debug
|
||
sourcemap: 'inline',
|
||
outDir: 'dist/electron/preload',
|
||
rollupOptions: {
|
||
external,
|
||
},
|
||
}
|
||
}
|
||
},
|
||
})
|
||
|
||
/**
|
||
* ## Why?
|
||
*
|
||
* Many times, many people want to use the Node.js package in Electron-Renderer, but it may not work correctly in Vite by default.
|
||
* 有很多时候很多人想在 Electron-Renderer 中使用 Node.js 模块，但这在 Vite 可能无法正常的构建。
|
||
*
|
||
* e.g.
|
||
* Let's use `serialport` as an example.
|
||
* 让我们使用 `serialport` 举个例子 🌰。
|
||
*
|
||
* ```js
|
||
* // ❌ May not work correctly in Vite by default.
|
||
* import serialport, { SerialPort, SerialPortMock } from 'serialport';
|
||
* ```
|
||
*
|
||
* At this time, we need to use `vite-plugin-resolve` to convert `serialport` to ensure that it works normally.
|
||
* 这时候我们需要使用 `vite-plugin-resolve` 转换 `serialport`，以确保它能正常工作。
|
||
*
|
||
* e.g.
|
||
*
|
||
* ```js
|
||
* // serialport
|
||
* const _M_ = require('serialport');
|
||
* const _D_ = _M_.default || _M_;
|
||
* export { _D_ as default };
|
||
* export const SerialPort = _M_.SerialPort;
|
||
* export const SerialPortMock = _M_.SerialPortMock;
|
||
* ```
|
||
*
|
||
* Try to use again.
|
||
*
|
||
* ```js
|
||
* // ✅ This looks like nothing has changed, but it works normally after the `vite-plugin-resolve` converted.
|
||
* import serialport, { SerialPort, SerialPortMock } from 'serialport';
|
||
* ```
|
||
*
|
||
* 🚧 It should be noted that the Node.js package, as a dependency of the project, should be placed in `dependencies`; Unless you konw how to build them with Vite.
|
||
* 需要注意的一点是，Node.js 模块作为项目的依赖，应该放到 `dependencies` 中；除非你知道如何使用 Vite 构建他们。
|
||
*/
|
||
export function useNodeJsInElectronRenderer() {
|
||
const entries = dependencies.reduce((memo, moduleId) => {
|
||
const members = Object.keys(require(moduleId))
|
||
const snippet_of_cjs2esm = lib2esm(
|
||
// CJS lib name
|
||
moduleId,
|
||
// export memebers
|
||
members,
|
||
{ format: 'cjs' },
|
||
)
|
||
return Object.assign(memo, { [moduleId]: snippet_of_cjs2esm })
|
||
}, {} as Parameters<typeof resolve>[0])
|
||
|
||
// (🎯-②): For use Node.js package in Electron-Renderer
|
||
return resolve(entries)
|
||
}
|