webpack - 无法使用 copy-webpack-plugin 将静态文件添加到 electron-forge

问题描述

无法将静态文件添加到 electron-forge。

中创建assets的文件夹src。

修改 webpack.rules.js：

module.exports = [
    // ... appended to default rules
    {
        test: /\.(jpg|png|svg|ico|icns)$/,
        loader: 'file-loader',
        options: {
            name: '[path][name].[ext]',
            publicPath: '../.', // move up from 'main_window'
            context: 'src', // set relative working folder to src
        },
    },
];

修改 webpack.plugins.js：

const ForkTsCheckerWebpackPlugin = require('fork-ts-checker-webpack-plugin');
const CopyPlugin = require('copy-webpack-plugin');
const path = require('path');

module.exports = [
    new ForkTsCheckerWebpackPlugin(),
    new CopyPlugin({
        patterns: [
            {
                from: path.join(__dirname, 'assets'),
                to: 'assets/',
            },
        ],
    }),
];

修改后的 index.ts：

import { app, BrowserWindow, Menu, Tray } from 'electron';

// ...

// In this file you can include the rest of your app's specific main process
// code. You can also put them in separate files and import them here.
let tray = null;
app.whenReady().then(() => {
    const trayPath = 'assets/iconTemplate.png';
    console.log(trayPath);

    tray = new Tray(trayPath);
    const contextMenu = Menu.buildFromTemplate([
        { label: 'Item1', type: 'radio' },
        { label: 'Item2', type: 'radio' },
        { label: 'Item3', type: 'radio', checked: true },
        { label: 'Item4', type: 'radio' },
    ]);
    tray.setToolTip('This is my application.');
    tray.setContextMenu(contextMenu);
});

输出：

Hash: c7b3751b2a01093270d2
Version: webpack 4.43.0
Time: 634ms
Built at: 06/14/2020 9:27:17 PM
       Asset      Size  Chunks                   Chunk Names
    index.js  33.2 KiB    main  [emitted]        main
index.js.map  39.3 KiB    main  [emitted] [dev]  main
Entrypoint main = index.js index.js.map
[./node_modules/debug/src/browser.js] 5.69 KiB {main} [built]
[./node_modules/debug/src/common.js] 5.79 KiB {main} [built]
[./node_modules/debug/src/index.js] 314 bytes {main} [built]
[./node_modules/debug/src/node.js] 4.37 KiB {main} [built]
[./node_modules/electron-squirrel-startup/index.js] 1 KiB {main} [built]
[./node_modules/has-flag/index.js] 320 bytes {main} [built]
[./node_modules/ms/index.js] 2.95 KiB {main} [built]
[./node_modules/supports-color/index.js] 2.7 KiB {main} [optional] [built]
[./src/index.ts] 2.06 KiB {main} [built]
[child_process] external "child_process" 42 bytes {main} [built]
[electron] external "electron" 42 bytes {main} [built]
[os] external "os" 42 bytes {main} [built]
[path] external "path" 42 bytes {main} [built]
[tty] external "tty" 42 bytes {main} [built]
[util] external "util" 42 bytes {main} [built]

虽然没有找到文件

UnhandledPromiseRejectionWarning: Error: Image could not be created from /assets/iconTemplate.png

这是我用来解决此问题的所有参考资料：

标签： webpackelectron-forge

webpack - 无法使用 copy-webpack-plugin 将静态文件添加到 electron-forge

问题描述

解决方案

推荐阅读