先看两个示例
vue.js
jQuery.js
打包的时候要加入一些版权信息，如果每次打完包都手动添加，岂不是很累。
可以使用webpack插件BannerPlugin添加版权信息
最简单的配置
const webpack = require('webpack') module.exports = { ... plugins: [ new webpack.BannerPlugin('版权信息') ] }
实用的配置
将变量信息从package.json文件引入，使用nunjucks的模板渲染能力，将模板和数据组合成最终输出的内容
// 引入版权插入必要 const webpack = require('webpack'); const { name, version, author, homepage, description } = require('./package'); const nunjucks = require('nunjucks'); const moment = require('moment'); // 使用模板渲染 const LICENSE = nunjucks.render('LICENSE', { name: name, version: version, description: description, author: author, homepage: homepage, date: moment().format('YYYY-MM-DD HH:mm:ss'), }); module.exports = { ... optimization: { minimizer: [ //压缩CSS代码 new CssMinimizerPlugin(), //压缩js代码 new TerserPlugin({ extractComments: false, // 不将注释提取到单独的文件中 }), // 添加版权信息 new webpack.BannerPlugin({ entryOnly: true, banner: LICENSE, raw: true, }), ], }, }
LICENSE
/*! * Name {{name}} * Version {{version}} * Author: {{author}} * Description: {{description}} * Homepage:{{homepage}} * Date: {{date}} */
参考
