webpack@4
andwebpack@5
is now supported.
A webpack
plugin for generating un-minified JavaScript files along with minimize
.
This plugin should only be used while you are developing standalone library
Maybe you are encountering the same issue as mine, once you are developing a standalone library via webpack
, it's not possible to generate the uncompressed file along with the minified version at one time. Here is the question i found at stackoverflow
, it seems many people are suffering for this.
As a workaround, you may do something like webpack && webpack --config webpack.config.prod.js
, but the solution is really ugly and inelegant.
That's why i am here! ^^
npm install --save-dev unminified-webpack-plugin
const path = require('path');
const webpack = require('webpack');
const UnminifiedWebpackPlugin = require('unminified-webpack-plugin');
module.exports = {
mode: 'production',
entry: {
index: './src/index.js'
},
output: {
path: path.resolve(__dirname, 'dist'),
filename: 'library.min.js'
},
plugins: [
new UnminifiedWebpackPlugin()
]
};
By doing as above, you will get two files library.min.js
and library.js
. No need execute webpack
twice, it just works!^^
filename
includesmin
, such as:ad-min.js
,ad-min-1.0.js
, will be treated as minified name as well. See cope with 'min' in names like 'Admin'
postfix
: you can specify the nomin
part as you wish. nomin
is the default postfix once you haven't specify min
in output.filename
. And it can be customized by specifying this option, following is example:
const path = require('path');
const webpack = require('webpack');
const UnminifiedWebpackPlugin = require('unminified-webpack-plugin');
module.exports = {
entry: {
index: './src/index.js'
},
output: {
path: path.resolve(__dirname, 'dist'),
filename: 'library.js'//no "min" specified
},
plugins: [
new UnminifiedWebpackPlugin({
postfix: 'unmin',//specify "nomin" postfix
include: /polyfill.*/,
exclude: /test.*/
})
]
};
By doing as above, you will get two files
library.js
andlibrary.unmin.js
include
,exclude
just work the same way asUglifyJsPlugin
Check working-example for css assets support