Question

我正在使用电子伪造来构建电子应用程序，正在使用webpack模板（https://www.electronforge.io/templates/webpack-template）。在我的应用程序中，我需要包含静态资产（javascript，css和图像）

为此，我将copy-webpack-plugin包含在render.config.js文件中，这在测试应用程序electron-forge start时有效，但是在尝试编译应用程序electron-forge build时则有效不包含在构建中。

module.exports = {
  // Put your normal webpack config below here
  module: {
    rules
  },
  plugins: [
    new CopyPlugin([
      { from: './src/images', to: 'images' },
      { from: './src/js', to: 'js' },
      { from: './src/css', to: 'css' },
      { from: './src/webfont', to: 'webfont' }
    ])
  ]
}

我希望将css和其他资产以与测试应用程序时相同的方式捆绑在我的应用程序中。

Answer 1

将CopyPlugin配置放置在webpack.plugins.js文件中，而不是render.config.js
您的配置似乎不正确，因为它错过了patterns选项。
您必须提供CopyPlugin的完整路径。

样品：

module.exports = [
  new CopyPlugin({
    patterns: [
      {
        from: path.resolve(__dirname, '../app/localization/locales'),
        to: path.resolve(__dirname, '../.webpack/locales')
      }
    ]
  })
]

Answer 2

实际上，我在使用 electron-forge + webpack + typescript 和使用 CopyWebpackPlugin 复制一些资源文件时遇到了同样的问题。

webpack.main.config.js

const CopyPlugin = require("copy-webpack-plugin");

module.exports = {
  entry: './src/index.ts',
  module: {
    rules: require('./webpack.rules')
  },
  resolve: {
    extensions: ['.js', '.ts', '.jsx', '.tsx', '.css', '.json']
  },
  plugins: [
    new CopyPlugin([
      { from: 'resources/credentials.json', to: 'resources/credentials.json'}
    ]),
  ]
}

在我的一个源文件中，我试图读取文件。

const credentialsFile = fs.readFileSync('resources/credentials.json'));
const credentials = JSON.parse(credentialsFile.toString());

这在使用 electron-forge start 运行时有效，但是当使用 electron-forge package 构建二进制文件时，出现以下异常：-

Uncaught Exception:
Error: ENOENT: no such file or directory, open 'resources/credentials.json'
    at Object.openSync (fs.js:476:3)
...

原来我只需要在构建路径时添加 __dirname。

const credentialsFile = fs.readFileSync(path.join(__dirname, 'resources', 'credentials.json'));

电子锻造将建筑中的静态资产捆绑在一起

2 个答案: