An ES20XX starter with common frontend tasks using Webpack 5 as module bundler and npm scripts as task runner.
If you serve your files over HTTPS with HTTP/2, use compression (gzip, brotli...) for text-based resources, and respect accessibility rules, your lighthouse score will be 100%.
Setup
Requirements
Node ">=15.0.0" (use brew or install it from here)
SpritesmithPlugin: convert a set of images into a spritesheet and SASS/LESS/Stylus mixins
CompressionPlugin: Prepare compressed versions of assets to serve them with Content-Encoding (default to gzip). Requires server configuration so it is commented here
GenerateSW: The GenerateSW plugin will create a service worker file for you and add it to the webpack asset pipeline.
BannerPlugin: add a banner to the top of each generated chunk.
ObsoleteWebpackPlugin: A Webpack plugin generates a browser-side standalone script that detects browser compatibility based on Browserslist and prompts website users to upgrade it.
WebpackBundleAnalyzer: Visualize size of webpack output files with an interactive zoomable treemap.
npm scripts
npm run clean: remove all the files from the dist directory
npm run favicons: generate favicons files and /src/templates/_favicons.ejs
请发表评论