electron / electron/forge

Webpack plugin: add escape hatch for custom webpack configs

Open
#3,215 1 comment 4 reactions 0 assignees View on GitHub
plugin/webpack
Dominant language
TypeScript
Stars
7.1k
Forks
641
Avg merge
3d 1h
Merged PRs (30d)
30

Description

### Pre-flight checklist

- [X] I have read the [contribution documentation](https://github.com/electron/forge/blob/main/CONTRIBUTING.md) for this project.
- [X] I agree to follow the [code of conduct](https://github.com/electron/electron/blob/main/CODE_OF_CONDUCT.md) that this project uses.
- [X] I have searched the issue tracker for a feature request that matches the one I want to file, without success.

### Problem description

In a similar vein to https://github.com/electron/forge/issues/3169, my project requires an additional webpack bundle to function: a `target: web` bundle served by a webserver. Currently this is very hard to accomplish with `WebpackPlugin`.

### Proposed solution

It'd be really useful to add an "escape hatch" or two to enable custom webpack config. One option would be to add an `extraConfig` option:

```
plugins: [
{
name: '@electron-forge/plugin-webpack',
config: {
extraConfig: ['./webpack.extra.config.js'],
}
}
]
```

Another option would be to provide hooks for modifying the webpack config for the renderer or main process before they run. This would be the most flexible for projects with complex builds, though care would need to be taken by users when upgrading `electron-forge` since the webpack config generated isn't expected to be stable.

### Alternatives considered

- I tried using `webpack()` programmatically inside `generateAssets`, but the `.webpack` folder was deleted afterwards by the webpack plugin (also this approach gives up watch mode)
- Using a hacky `preload` only renderer entry with a custom config almost worked, but the [target gets overridden](https://github.com/electron/forge/blob/5b40a8dbeeebb388f5aa1a39c1f452b8b7800f45/packages/plugin/webpack/src/WebpackConfig.ts#L189)

Eventually I ended up monkeypatching `WebpackConfig.getRendererConfig` to add my extra webpack config object. This gives me watch mode for free, which is handy.

### Additional information

_No response_

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.