Gathering detailed insights and metrics for webpack-plugin-hash-output-mini-css
Gathering detailed insights and metrics for webpack-plugin-hash-output-mini-css
Gathering detailed insights and metrics for webpack-plugin-hash-output-mini-css
Gathering detailed insights and metrics for webpack-plugin-hash-output-mini-css
npm install webpack-plugin-hash-output-mini-css
Typescript
Module System
Node Version
NPM Version
69.7
Supply Chain
98.9
Quality
75.1
Maintenance
100
Vulnerability
100
License
JavaScript (99.86%)
CSS (0.14%)
Total Downloads
1,238,225
Last Day
2
Last Week
4
Last Month
12
Last Year
180
128 Stars
94 Commits
29 Forks
7 Watching
18 Branches
6 Contributors
Minified
Minified + Gzipped
Latest Version
3.1.0-beta.4
Package Id
webpack-plugin-hash-output-mini-css@3.1.0-beta.4
Unpacked Size
248.73 kB
Size
67.16 kB
File Count
60
NPM Version
5.6.0
Node Version
8.10.0
Cumulative downloads
Total Downloads
Last day
0%
2
Compared to previous day
Last week
0%
4
Compared to previous week
Last month
33.3%
12
Compared to previous month
Last year
-63.3%
180
Compared to previous year
Plugin to replace webpack chunkhash with an md5 hash of the final file conent.
With npm
npm install webpack-plugin-hash-output --save-dev
With yarn
yarn add webpack-plugin-hash-output --dev
There are other webpack plugins for hashing out there. But when they run, they don't "see" the final form of the code, because they run
before plugins like webpack.optimize.UglifyJsPlugin
. In other words, if you change webpack.optimize.UglifyJsPlugin
config, your
hashes won't change, creating potential conflicts with cached resources.
The main difference is that webpack-plugin-hash-output
runs in the last compilation step. So any change in webpack or any other plugin
that actually changes the output, will be "seen" by this plugin, and therefore that change will be reflected in the hash.
It will generate files like entry.<hash>.js
, where <hash>
is always a hash of the content (well, a subset of). Example:
$ md5 entry.32f1718dd08eccda2791.js
MD5 (entry.32f1718dd08eccda2791.js) = 32f1718dd08eccda2791ff7ed466bd98
All other assets (common files, manifest files, HTML output...) will use the new md5 hash to reference the asset.
Requires webpack >=4
Just add this plugin as usual.
1// webpack.config.js 2var HashOutput = require('webpack-plugin-hash-output'); 3 4module.exports = { 5 // ... 6 output: { 7 //... 8 filename: '[name].[chunkhash].js', 9 }, 10 plugins: [ 11 new HashOutput(options) 12 ] 13};
This plugin partially supports sourcemaps. When a chunk hash is recomputed, it will update the name of the chunk in the chunks's sourcemap, but it won't recompute the name of the hash file. This has the side effect that the name of the sourcemap will differ from the name of the chunk. Example:
Before:
1// app.<oldhash>.js 2 3// ...code... 4//# sourceMappingURL=entry.<oldhash>.js.map
1// app.<oldhash>.js.map 2 3// ... 4"file":"app.<oldhash>.js" 5// ...
After:
1// app.<newhash>.js 2 3// ...code... 4//# sourceMappingURL=entry.<oldhash>.js.map
1// app.<oldhash>.js.map 2 3// ... 4"file":"app.<newhash>.js" 5// ...
We can't fully support sourcemaps (i.e. recomute sourcemap hash) because the circular reference: we can't compute sourcemap hash without computing the file hash first, and we can't compute the file hash without the sourcemap hash.
Note: Use Webpack's own hash output options to configure hash function and length.
options.validateOutput
boolean
, defaults to false
.
After webpack has compiled and generated all the assets, checks that the hash of the content is included in the file. If it is not, it will throw an error and the webpack process will fail.
options.validateOutputRegex
regex
, defaults to /^.*$/
When validating the output (see options.validateOutput
), only evaluate hashes for files matching this regexp.
Useful for skipping source maps or other output. Example:
1module.exports = { 2 entry: { 3 main: './src/app.js', 4 }, 5 output: { 6 filename: 'assets/[name].[chunkhash].js', 7 }, 8 plugins: [ 9 new HtmlWebpackPlugin({ 10 filename: 'fragments/app.html', 11 chunks: ['main'], 12 }), 13 new OutputHash({ 14 validateOutput: true, 15 // Check that md5(assets/main.<hash>.js) === <hash>, but doesn't check fragments/app.html 16 validateOutputRegex: /^assets\/.*\.js$/, 17 }), 18 ] 19};
Tests can be run by:
yarn test
After running the tests, you might want to run yarn run clean
to clean up temp files generated by the tests.
No vulnerabilities found.
Reason
no binaries found in the repo
Reason
license file detected
Details
Reason
Found 4/25 approved changesets -- score normalized to 1
Reason
0 commit(s) and 0 issue activity found in the last 90 days -- score normalized to 0
Reason
no effort to earn an OpenSSF best practices badge detected
Reason
project is not fuzzed
Details
Reason
security policy file not detected
Details
Reason
branch protection not enabled on development/release branches
Details
Reason
SAST tool is not run on all commits -- score normalized to 0
Details
Reason
64 existing vulnerabilities detected
Details
Score
Last Scanned on 2024-12-23
The Open Source Security Foundation is a cross-industry collaboration to improve the security of open source software (OSS). The Scorecard provides security health metrics for open source projects.
Learn More