Repository navigation
docs: how to use webpack's own css and html minimizers - #718
Merged
Merged
Conversation
They ship with webpack and need no extra dependency, and they are the two that can hand out what a document or a stylesheet nests inside itself, so what the README already says about embedded source had no worked example to point at. Name them in the css and html minimizer lists and add a section: the import paths, a config using them alongside terser and json, what each declares, where `environment` goes, and the two ways it goes wrong -- passing `renderEmbeddedSource` (the plugin owns it) and a second copy of webpack in the tree, whose error message is quoted.
|
Codecov Report✅ All modified and coverable lines are covered by tests. Additional details and impacted files@@ Coverage Diff @@
## main #718 +/- ##
=======================================
Coverage 94.73% 94.73%
=======================================
Files 4 4
Lines 1102 1102
Branches 392 392
=======================================
Hits 1044 1044
Misses 51 51
Partials 7 7 ☔ View full report in Codecov by Harness. 🚀 New features to boost your workflow:
|
eslint lints the code blocks in the README, and the example was a fragment -- a labelled statement with a trailing comma -- so `lint:code` rejected it. Bind it to a name instead; the config it shows is unchanged.
`cssMinify` and `htmlMinify` are not on webpack's public surface today -- they are absent from `lib/index.js` and from `types.d.ts`, so the section documented a deep require into `webpack/lib/`. They are being exported on `webpack.css.syntax` and `webpack.html.syntax` instead, which is where the parser they already read at run time lives, so point the docs there and state the release that carries them.
The section named `environment` and then waved at "the rest". Tabulate what each minifier actually accepts, read off the two functions rather than their JSDoc: the top-level options with types and defaults, and the per-transform switches, which sit beside the rest rather than nested because `pickTransforms` is handed the whole options object. State what `css` takes on `htmlMinify`, since it is a subset plus the CSS switches, and `environment` is deliberately not in it.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
The README names webpack's own
cssMinifyandhtmlMinifytwice under Embedded source but never shows how to import or configure them, so the section explaining that they are the two minimizers able to hand out nested bodies had no worked example to point at. Adds awebpack's own minimizerssection — import paths, a config using them alongsideterserMinifyandjsonMinify, what each declares (getTypes/getEmbeddedTypes/filter/supportsWorkerThreads), whereenvironmentgoes, and the two ways it goes wrong: passingrenderEmbeddedSourceyourself (the plugin owns that option and replaces it) and a second or older copy of webpack in the tree, whose error message is quoted so it is searchable. Also lists them in the existing CSS and HTML minimizer lists.Every snippet was executed against a real build rather than written from the types: two corrections came out of that,
environmentbeing top level onhtmlMinifyrather than nested undercss, andCssEnvironmentbeing{ browsers, vendorPrefixes }.What kind of change does this PR introduce?
docs
Did you add tests for your changes?
No — documentation only, no source change. The configurations shown were run against a real webpack build to confirm they work.
Does this PR introduce a breaking change?
No.
If relevant, what needs to be documented once your changes are merged or what have you already documented?
This is the documentation. Nothing further is needed after merge.
Use of AI
Claude Code drafted the section and verified it by running every configuration in it against a real build instead of transcribing the JSDoc, which is how the two option-shape errors above were caught before they shipped. The
require("webpack")failure mode documented at the end was likewise found by hitting it, not by reading the code.Generated by Claude Code