如何在Electron主js脚本中调用Webpack捆绑的函数

如何解决如何在Electron主js脚本中调用Webpack捆绑的函数

我正在尝试从我的（网络包装的）捆绑包中访问功能，但该功能未定义。（整个对象为空）（在electronic-main.js中，请参见appBundle.test()）

我一直在网上搜索，但找不到所需的答案。尝试了所有不同的libraryTarget选项，但没有一个按我预期的方式工作。

这是源代码：

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();
    });
    ...
}


...

解决方法

显然，import "./application/index.tsx";呼叫以某种方式使出口混乱。当我只是使用干净的文件作为入口点时，它工作正常。

无论如何，我最终只是将电子项目和应用程序捆绑在一起打包到一个程序包中。