修改 Webpack 配置
使用 electron-webpack 的另一个巨大好处是，您永远不会受限于抽象的 API。当然，没有一种配置能满足所有人的需求，而 electron-webpack 也意识到了这一点。
可以为 renderer、renderer-dll 和 main 进程进行自定义修改。请注意，完整的 webpack API 是可用的，并且没有被阻止。您可以添加任何加载器和插件，但请记住，进行重大修改可能会破坏预期的行为。
目前有两种修改 webpack 配置的方法
与作为库扩展相比，使用这两种方法的好处是，您不会失去对 electron-webpack CLI 的访问权限，这对于开发非常有利。
使用配置对象¶
得益于 webpack-merge 的强大功能，通过简单地提供一个配置对象，即可添加您自己的 webpack 加载器、插件等，该对象将使用 智能合并策略 自动合并到预定义的配置之上。
用例¶
假设我们的项目需要在 renderer 进程中能够导入 *.txt 文件。我们可以使用 raw-loader 来完成这项工作。
安装 raw-loader¶
yarn add raw-loader --dev
配置 electron-webpack¶
为 electron-webpack 提供配置，例如在您的 package.json 文件中，并将其指向渲染器进程的自定义 webpack 配置文件
{
"electronWebpack": {
"renderer": {
"webpackConfig": "webpack.renderer.additions.js"
}
}
}
配置 raw-loader¶
module.exports = {
module: {
rules: [
{
test: /\.txt$/,
use: 'raw-loader'
}
]
}
}
现在，当运行 electron-webpack 的 CLI 时，您的自定义添加项将被加载，您可以像预期那样使用它们。
这是一种非常方便的方式，可以在默认配置之上添加配置，但当涉及到修改默认配置甚至删除部分配置时，它有一些局限性。
如果您需要对配置进行更多控制，那么 配置函数 或 作为库扩展 可能更适合您的需求。
使用配置函数¶
从 2.7.0 版本开始，electron-webpack 支持导出函数而不是对象的配置模块。
在这种情况下，您提供的配置函数将在默认配置对象作为参数的情况下被调用，并且期望它返回最终的配置对象。
您可以使用任何您喜欢的方法修改默认对象，例如您可以迭代加载器或插件，并删除或替换其中的一些。您可以手动使用像 webpack-merge 这样的工具，或者如果它适合您的需求，您甚至可以创建并返回一个全新的对象。
用例¶
假设您希望 css-loader 将所有内容都视为 CSS 模块，并隐式地将所有类名转换为哈希变体，除非您将它们显式定义为 :global。
首先，配置 electron-webpack 以使用您的自定义配置文件。
请注意，虽然文件名在技术上并不重要，但我们没有像以前那样在名称中使用“additions”，因为此配置文件提供的不仅仅是添加项。
{
"electronWebpack": {
"renderer": {
"webpackConfig": "webpack.renderer.js"
}
}
}
接下来，提供您的自定义配置文件
module.exports = function(config) {
const styleRules = config.module.rules.filter(rule =>
rule.test.toString().match(/css|less|s\(\[ac\]\)ss/)
)
styleRules.forEach(rule => {
const cssLoader = rule.use.find(use => use.loader === 'css-loader')
// this is the actual modification we make:
cssLoader.options.modules = 'local'
})
return config
}
如您所见，我们导出的是一个函数，而不是一个对象。
该函数接收 webpack 配置对象，只是在某些地方对其进行修改，然后再次返回它。
当对配置对象的结构有疑问时，您可以熟悉定义它的源文件，或者只是在函数内部尝试快速的 console.log(config)。
或者更好的是，尝试 console.log(JSON.stringify(config, null, 4)) 以在可读的格式中显示所有嵌套的值。
如果您需要对配置进行更多控制，那么 作为库扩展 可能更适合您的需求。