webpack
Provides comprehensive guidance for Webpack bundler including configuration, loaders, plugins, code splitting, optimization, and development setup. Use when the user asks about Webpack, needs to configure Webpack, set up build pipelines, optimize bundles, or work with Webpack plugins.
- Installs
- 67
- Last 24h
- —
- Trending rank
- —
- Security
- Not audited
Install
Works with every agent the skills CLI supports.
npx skills add https://github.com/full-stack-skills/build-skills --skill webpack- 01
Install
Run the command in your project. The CLI asks which agents to install for.
- 02
Describe the task
Ask your agent for something this skill covers. It loads webpack automatically when relevant.
- 03
Review the result
The agent follows the SKILL.md steps, scripts and references bundled with the skill.
SKILL.md
The instructions your agent reads when the skill is triggered.
When to use this skill
Use this skill whenever the user wants to:
- 用 Webpack 打包 JS/CSS/资源、配置 loader、plugin 与优化
- 处理多入口、代码分割、缓存与 dev server
How to use this skill
- 配置：entry、output、module.rules（babel、css、file）；plugins（HtmlWebpackPlugin、MiniCssExtract）。
- 进阶：splitChunks、懒加载、devtool、HMR；环境变量与 mode。
- 参考：https://webpack.js.org/
Best Practices
- loader 顺序与 exclude；生产压缩与 tree-shaking。
- 大项目考虑 Vite 或 Rspack；缓存与构建速度。
Keywords
webpack, 打包, loader, plugin, 代码分割
FAQ
What does the webpack skill do?
Provides comprehensive guidance for Webpack bundler including configuration, loaders, plugins, code splitting, optimization, and development setup. Use when the user asks about Webpack, needs to configure Webpack, set up build pipelines, optimize bundles, or work with Webpack plugins.
How do I install webpack?
Run npx skills add https://github.com/full-stack-skills/build-skills --skill webpack in your project. The skills CLI detects the agents you use and copies the skill into the right folder. For Claude Code you can also place the skill folder at ~/.claude/skills/webpack/ (personal) or .claude/skills/webpack/ (project).
Which AI agents can use webpack?
Any agent that supports the open Agent Skills format (a folder with a SKILL.md file), including Claude Code, Codex, Cursor, GitHub Copilot, Gemini CLI, Windsurf, Cline, OpenCode and more.
Is webpack safe to install?
No partner security audit is available yet. Skills can run commands and scripts, so read the SKILL.md and any bundled files before installing.
Who maintains webpack?
It is published by full-stack-skills in full-stack-skills/build-skills. It has 67 recorded installs.
More from full-stack-skills/build-skills
hbuilderx-cli
full-stack-skills/build-skills
HBuilderX CLI 命令行工具技能。当用户需要通过命令行启动 uni-app 开发环境、查看运行日志、运行自动化测试、配置 HBuilderX CLI 环境，或在 npm scripts 中集成 HBuilderX 工作流时使用。覆盖 Web、Android、iOS、HarmonyOS、小程序等多平台开发。
Popular other skills
hyperframes-cli
heygen-com/hyperframes
The HyperFrames CLI by job - scaffold, check, look at frames, edit the timeline, preview, render locally or in the cloud, publish, project history - plus reading its JSON and recovering from build or render failures.
triage
mattpocock/skills
Move issues and external PRs through a state machine of triage roles, categorise, verify, grill if needed, and write agent-ready briefs.
ask-matt
mattpocock/skills
Ask which skill or flow fits your situation. A router over the skills in this repo.
to-questionnaire
mattpocock/skills
Turn a decision you can't fully answer into a questionnaire for someone else to fill in.
loop-me
mattpocock/skills
Grill me about specs for the workflows I want to build, within this workspace.