Webpack Config Generator Prompt
Generate a version-compatible webpack configuration from a supplied project layout, runtime, entry points, module rules, development needs, build targets, and validation evidence.
Prompt Template
You are a senior frontend build-tooling engineer generating a webpack configuration only from the repository facts, installed versions, runtime contract, entry graph, asset types, development workflow, and deployment target I provide. Produce the smallest maintainable configuration compatible with the exact webpack generation and plugin versions. Treat webpack, its command-line interface, JavaScript runtime, framework adapters, transpilers, loaders, plugins, development server, CSS pipeline, test tools, browsers, server rendering, and hosting as separate compatibility constraints. Never invent package versions, config keys, loader syntax, plugin exports, defaults, paths, ports, aliases, environment values, optimization guarantees, or successful validation. Project purpose: [web app, multi-page app, library, server bundle, monorepo package, other] Repository structure and config location: [sanitized tree] Package manager and workspace setup: [details] Exact webpack, CLI, and JavaScript runtime versions: [versions or unknown] Package module mode and config-file extension: [ESM, CommonJS, mixed, unknown] Framework, compiler or transpiler, loaders, plugins, and exact versions: [verified list] Existing webpack configs, shared factories, and migration goal: [paste sanitized content or none] Entry points, dependency graph, HTML ownership, source root, public assets, and output ownership: [details] Development server requirements: [local host boundary, port preference, HTTPS, hot reload, history fallback, proxy needs] JavaScript, TypeScript, JSX, CSS, preprocessors, images, fonts, workers, WebAssembly, and other asset types: [verified needs] Browser, runtime, and syntax targets: [verified support matrix] Import aliases and matching TypeScript, test, editor, and runtime resolution: [details or none] Environment variables, define replacements, modes, and secret boundary: [details] Build format, chunks, source maps, minification, public path, filenames, manifest, and deployment target: [verified requirements] Library, server-side rendering, module federation, or multi-page requirements: [details or none] Performance evidence and optimization budget: [bundle report, timings, cache constraints, or unknown] Current development, build, test, analyze, and CI commands: [details] Exact sanitized errors or unwanted behavior: [paste output] Security constraints: [no secret exposure, unsafe proxying, broad network binding, path escape, or untrusted loader execution] Validation available: [config load, development smoke test, production build, tests, bundle inspection, deployment preview] Output scope: [single config, development and production variants, shared factory, scripts, migration notes] Provide: 1. An assumptions table marking every version, path, entry, loader, plugin, option, default, environment behavior, target, and deployment fact as verified, inferred, or unknown. 2. A recommendation for one config, a shared factory with mode branches, or separate variants, with filename and syntax justified by the supplied runtime and module mode. 3. Complete minimal config content containing only version-supported keys, verified loaders and plugins, explicit placeholders for unresolved values, and no unnecessary compatibility layers. 4. A rule and plugin map for every supplied file type and transformation, including include and exclude boundaries, package ownership, order, output, and representative test file. 5. A path-resolution map for entries, output, public path, assets, aliases, environment files, development server, proxies, cache, and monorepo boundaries. 6. A development and security review covering local-only binding, allowed hosts, HTTPS, proxies, client-exposed values, source maps, filesystem scope, generated HTML, and production separation. 7. A dependency list separated into installed, required after verification, optional, obsolete, duplicated, and conflicting packages. 8. A migration plan covering old configs, scripts, aliases, environment handling, loaders, plugins, generated output, caches, tests, CI, deployment settings, rollback, and contributor notes. 9. Version-appropriate commands for config loading, development smoke testing, clean building, testing, inspecting chunks and assets, checking client-exposed data, and validating a deployment preview, labeling anything that needs official-documentation verification. 10. A final audit for unsupported keys, hidden defaults, duplicate transforms, broad loader matches, broken aliases, exposed secrets, unsafe hosts or proxies, incorrect public paths, stale output, source-map leakage, cache errors, client-server drift, and claims not backed by actual command output. Do not expose secrets, bind development services broadly without authorization, proxy untrusted targets, install loaders or plugins without version evidence, overwrite framework-owned configuration, include proprietary source code in examples, or claim the config works without running validation.
Example Output
Verified Inputs
The supplied project is a browser application with exact webpack, command-line, and runtime versions, one verified JavaScript entry, CSS and image imports, and a static hosting target. Package module mode, output folder, browser targets, and local-only development host are known. TypeScript, framework adapters, aliases, proxies, server rendering, and extra plugins remain unverified.
Proposed Shape
Use one config factory keyed by the supplied mode. Share the verified entry, output, asset, and resolution rules; enable development diagnostics only in development and production optimization only through documented defaults or supplied requirements. Omit unverified loaders, aliases, proxies, and plugins.
Validation Boundary
Load both modes, run a local smoke test, create a clean production build, inspect asset URLs and exposed values, run tests, and verify the hosting preview. A successful config parse alone does not prove runtime correctness.
Tips for Best Results
- ๐กProvide exact webpack, CLI, runtime, framework, compiler, loader, plugin, test-tool, and hosting versions.
- ๐กMap each file type to one verified transformation path and keep loader include and exclude boundaries narrow.
- ๐กValidate both modes, bundle output, asset paths, client-exposed values, tests, and a real deployment preview.
Frequently Asked Questions
What is the Webpack Config Generator Prompt prompt?
Generate a version-compatible webpack configuration from a supplied project layout, runtime, entry points, module rules, development needs, build targets, and validation evidence. It's a free ChatGPT prompt template from our Coding collection โ copy it, fill in the bracketed variables, and paste it into your AI tool.
Which AI tools work with this prompt?
It's written and tested for ChatGPT, Claude and Gemini. Any AI assistant that accepts free-form text prompts will handle it well.
How do I customize this ChatGPT prompt?
Replace the bracketed variables โ such as [sanitized tree], [details], [versions or unknown] โ with your own details before running it. Provide exact webpack, CLI, runtime, framework, compiler, loader, plugin, test-tool, and hosting versions.
Is this prompt free to use?
Yes. Every prompt on PromptAtlas is free to copy, customize, and use โ no signup required.
Related Prompts
Code Review Assistant
Get a thorough, senior-level code review with actionable feedback on quality, security, performance, and best practices.
Debugging Detective
Systematically debug errors and unexpected behavior with root cause analysis and fix suggestions.
Code Refactoring Advisor
Transform messy, complex code into clean, maintainable, well-structured code with clear explanations.