问题
I am experimenting with electron. I see a lot of examples that use webpack.
But why use something like webpack? Because as far as I can tell electron supports require('module').
回答1:
It is not webpack which is used in electron. The require function is part of the node.js, which is the base for electron.
More informations about the modules at the node.js docs: https://nodejs.org/dist/latest-v5.x/docs/api/modules.html
But as long as webpack is also availiable as a node module (https://www.npmjs.com/package/webpack) it is also possible to use webpack with electron. At this point you are also able to use the build on the fly in production, because node and chrome are availiable inside one app.
Why use webpack with electron? When you use react or vue.js components maybe it is a good idea to separate the components. To bundle your code into one app you need browserfy or webpack. That would be for example a good cause, why to use it.
回答2:
Webpack is not just a JS module bundler; it can be used for bundling static assets (inline base64 of images, for example), compiling Sass/Less/Stylus/CSS-Modules, dead code elimination, tree-shaking, and more. With the proper loaders and config, one only needs to require('any-type-of-file.extension') when actively developing. In my personal experience, however, more than all of that, Webpack is valuable because of it's dev-server and Hot Module Replacement (HMR), which makes Live Reload feel like something from the dark ages.
To recap, you get all the combined power of Gulp/Browserify/Rollup, but with HMR on top, all within a single tool (and lots and lots and lots and lots of loaders ;).
Setting up Webpack is a PITA, no doubt, but if you plan on working on an Electron app for a good amount of time, the time saved from HMR alone is well worth it.
回答3:
There is no reason to use Webpack in Electron, check out electron-compile to use Babel and LESS in Electron.
回答4:
Good documentation to start to get https://webpack.electron.build/
-Use of webpack for source code bundling
-Use of webpack-dev-server for development
-HMR for both renderer and main processes
-Use of @babel/preset-env that is automatically configured based on your electron version
-Ability to add custom webpack loaders, plugins, etc.
-Add-ons to support items like TypeScript, Less, EJS, etc.
来源：https://stackoverflow.com/questions/36614776/why-use-webpack-with-electron