Scaffold a working webpack.config.js in seconds. Choose your entry, output, mode and extras, then copy the config into your project — free and private.
Save the output as webpack.config.js in your project root, then install the dev dependencies shown above it.
How to Use
- Set your entry file, output folder and filename.
- Pick a mode and tick the extras you need.
- The config regenerates live as you change options.
- Press Copy config and save it as webpack.config.js in your project.
- Install the listed dev dependencies with npm.
Key Features
- Live config — regenerates with every change.
- Sensible defaults — a production-ready starting point.
- Loaders and plugins — CSS, Babel, TypeScript and HTML covered.
- Install command — the exact npm command for your choices.
- 100% private — everything runs in your browser; nothing is sent or stored.
FAQs
Where do I save the config?
Save it as webpack.config.js in your project root, then run npx webpack to build.
Do I need to install everything listed?
Install the dev dependencies shown under the output — they match exactly the options you ticked.
What does the dev server do?
It serves your app locally with live reloading while you develop. Run it with npx webpack serve.
Is my data sent anywhere?
No. The config is generated entirely in your browser and never transmits or saves your entries.
Related Tools
Package.json Generator · Env Generator · Dockerfile Generator · JS Minifier