Electron主js脚本中如何调用Webpack绑定的function

Question

I'm trying to access a function from my (webpack'ed) bundle, but the function is undefined. (The entire object in empty) (In electron-main.js see appBundle.test() )

I've been searching all over the web, but can't find the answer I'm looking for. Tried all the different libraryTarget options, but none of them worked the way I expected.

Here is the source code:

webpack.dev.js:

 ... module.exports = Merge(CommonConfig, { devtool: "inline-source-map", watch: true, entry: path.resolve(__dirname, "src/index.ts"), output: { filename: "bundle.js", path: __dirname + "/wwwroot/resources/js/components", publicPath: "/resources/js/components/", library: "appBundle", libraryTarget: "commonjs2" }, plugins: ([ new webpack.DefinePlugin({ "process.env": { "NODE_ENV": JSON.stringify("development") } }), // Etract CSS new MiniCssExtractPlugin({ filename: '[name].css', chunkFilename: '[id].css', }), ]), })

index.ts:

 import 'react-app-polyfill/ie11'; import 'react-app-polyfill/stable'; // Styling import './application-styling.scss'; // Application import "./application/index.tsx"; export default function test() { console.log('hello'); }

electron-main.js:

 const { BrowserWindow } = require('electron'); const createAppWindow = require('../main/app-process'); const authService = require('../services/auth-service'); global.window = {}; // <- Need to define this manually, else the require call throws errors const appBundle = require('app-bundle'); // Trying to import the bundle.js here let win = null; function createAuthWindow() { destroyAuthWin(); win = new BrowserWindow({ width: 1000, height: 600, webPreferences: { nodeIntegration: false, enableRemoteModule: false } }); win.loadURL(authService.getAuthenticationURL()); const { session: { webRequest } } = win.webContents; const filter = { urls: [ 'http://localhost/callback*' ] }; webRequest.onBeforeRequest(filter, async ({ url }) => { console.log(appBundle); // <- undefined or empty object, depending on libraryTarget console.log(appBundle.test()); // <- error, test is undefined await authService.loadTokens(url); createAppWindow(); return destroyAuthWin(); }); ... }...

Answer 1

Apparently the import "./application/index.tsx"; call somehow messed up the exports. When I just used a clean file as the entry point it worked fine.

Anyway I ended up just building the electron project together with the app bundle into one package.