README
snowpack-plugin-webpack5
Use Webpack5 to bundle your application for production.
Install
yarn add --dev snowpack-plugin-webpack5
npm install --save-dev snowpack-plugin-webpack5
Usage
Add snowpack-plugin-webpack5
to snowpack.config.json
:
{
"plugins": [
[
"snowpack-plugin-webpack5",
{
/* see "Plugin Options" below */
}
]
]
}
or to snowpack.config.js
:
module.exports = {
plugins: [
[
'snowpack-plugin-webpack5',
{
/* see "Plugin Options" below */
},
],
],
};
The options object is optional.
Default Build Script
{
"scripts": {"bundle:*": "snowpack-plugin-webpack5"}
}
Plugin Options
sourceMap: boolean
- Enable sourcemaps in the bundled output.outputPattern: {css: string, js: string, assets: string}
- Set the URL for your final bundled files. This is where they will be written to disk in thebuild/
directory. See Webpack'soutput.filename
documentation for examples of valid values.extendConfig: (config: WebpackConfig) => WebpackConfig
- extend your webpack config, see below.htmlMinifierOptions: boolean | object
- See below.
Extending The Default Webpack Config
The extendConfig
option is a function that you can provide to configure the default webpack config. If you provide this function, the plugin will pass its return value to webpack.compile()
. Use this to make changes, add plugins, configure loaders, etc.
Note that this requires you use a snowpack.config.js
JavaScript config file. JSON configuration cannot represent a function.
// snowpack.config.js
module.exports = {
plugins: [
[
'snowpack-plugin-webpack5',
{
extendConfig: (config) => {
config.plugins.push(/* ... */);
return config;
},
},
],
],
};
Minify HTML
With htmlMinifierOptions
you can either disable the minification entirely or provide your own options.
// snowpack.config.js
module.exports = {
plugins: [
[
'snowpack-plugin-webpack5',
{
htmlMinifierOptions: false, // disabled entirely,
},
],
],
};
The default options are:
{
collapseWhitespace: true,
removeComments: true,
removeEmptyAttributes: true,
removeRedundantAttributes: true,
removeScriptTypeAttributes: true,
removeStyleLinkTypeAttributes: true,
}