|
|
||||
|---|---|---|---|---|
| .. | ||||
| .npmignore | 11e3a9652a | 7 jaren geleden | ||
| LICENSE | 11e3a9652a | 7 jaren geleden | ||
| README.md | 11e3a9652a | 7 jaren geleden | ||
| index.js | 11e3a9652a | 7 jaren geleden | ||
| package.json | 11e3a9652a | 7 jaren geleden | ||
A Webpack plugin that allows you to transform \ modify assets just before Webpack emits them.
It allows you to transform \ modify Webpack assets just before Webpack emits them (writes them to files or memory in case you are using something like Webpack dev server).
It can be used for example to:
/* Author: John Doe */ comment on all the .js files Webpack generates.Using npm:
$ npm install --save-dev last-call-webpack-plugin
The plugin can receive the following options:
function(assetName, webpackAssetObject, assets) that returns a Promise. If the Promise returns a result this result will replace the assets content.compilation.optimize-assets. Can be one of the following values:compilation.optimize-chunk-assetscompilation.optimize-assetsemitfunction(assets, assetsAndProcessors, webpackCompilationObject) that will be called before the plugin starts calling the assets processors.function(error) that will be called after the plugin calls all the assets processors. If no errors occurred the error parameter will be undefined.true.Note: An environment supporting Promises or a Promise polyfill is needed for this plugin to be used.
var cssnano = require('cssnano');
var LastCallWebpackPlugin = require('last-call-webpack-plugin');
module.exports = {
module: {
loaders: [
{ test: /\.css$/, loader: ExtractTextPlugin.extract("style-loader", "css-loader") }
]
},
plugins: [
new ExtractTextPlugin("styles.css"),
new LastCallWebpackPlugin({
assetProcessors: [{
regExp: /\.js$/,
processor: (assetName, asset) => Promise.resolve('// Author: John Doe \n' + asset.source())
}, {
regExp: /\.css$/,
processor: (assetName, asset) => cssnano.process(asset.source())
.then(r => r.css)
}],
onStart: () => console.log('Starting to process assets.'),
onEnd: (err) => console.log(err ? 'Error: ' + err : 'Finished processing assets.'),
canPrint: true
})
]
}
The processor method is supplied an assets object that allows asset manipulation via the setAsset(assetName, assetValue) method. If assetValue is null the asset will be deleted. This object can be used to generate aditional assets (like source maps) or rename the an asset (create a new asset and delete the current one).
Example:
var cssnano = require('cssnano');
var LastCallWebpackPlugin = require('last-call-webpack-plugin');
module.exports = {
module: {
loaders: [
{ test: /\.css$/, loader: ExtractTextPlugin.extract("style-loader", "css-loader") }
]
},
plugins: [
new ExtractTextPlugin("styles.css"),
new LastCallWebpackPlugin({
assetProcessors: [{
regExp: /\.css$/,
processor: (assetName, asset, assets) => {
assets.setAsset(assetName + '.map', null); // Delete the <assetName>.map asset.
assets.setAsset(assetName + '.log', 'All OK'); // Add the <assetName>.log asset with the content 'All OK'.
return cssnano
.process(asset.source())
.then(r => r.css)
}
}],
onStart: () => console.log('Starting to process assets.'),
onEnd: (err) => console.log(err ? 'Error: ' + err : 'Finished processing assets.'),
canPrint: true
})
]
}
The assets object also has a getAsset(assetName) method to get the content of an asset (returns undefined in case the asset does not exist).