はじめに
webpackでbuild（全てのモジュールをbundleする）場合において、依存ライブラリのライセンスチェックを行う方法についてみていきたいと思う。
※フロントエンドでは全モジュールをbundleするので、今回見ていく方法はフロントエンドのプロジェクトにおけるライセンスチェックを行う方法になる。バックエンドのNode.jsでは仮にNode.jsでimport・export（ES6の構文）を使えるようにwebpack × Babelの設定をやってみたのように、webpackでbuildをしていても全モジュールのbundleはしないので、以下で見ていく方法は利用できない。代わりにの方法が利用できる）。
※以下では、既にwebpackの設定は済んでいる事を前提にしている。
結論 どうやるのか？
License Webpack Pluginを利用する。
[study@localhost intro-vuecli]$ npm install -D license-webpack-plugin
const { LicenseWebpackPlugin } = require('license-webpack-plugin');
module.exports = {
// 省略
plugins: [
new LicenseWebpackPlugin({
unacceptableLicenseTest: (licenseType) =>
['GPL', 'AGPL', 'LGPL', 'NGPL'].includes(licenseType),
outputFilename: 'meta/license.txt'
}),
// 省略
]
};
このように設定した状態で、buildを行うと以下のようにunacceptableLicenseTestの条件に合致する場合、buildエラーになる（以下ではエラーになるようにわざとMITを設定に追加してbuildをしている）。
ソースコード全体は以下。
※webpack-license-pluginというライブラリもあるが、今回はGitHubのスターの多いlicense-webpack-pluginの方を利用した。
Vue.js（2.x）だとどうなるか？
Vue-CLIであればvue.config.jsを以下のように設定する事で同じように、同様にライセンスのチェックができる。
const { LicenseWebpackPlugin } = require('license-webpack-plugin');
module.exports = {
configureWebpack: {
plugins: [
new LicenseWebpackPlugin({
unacceptableLicenseTest: (licenseType) =>
['GPL', 'AGPL', 'LGPL', 'NGPL'].includes(licenseType),
outputFilename: 'meta/license.txt'
})
]
}
};
ソースコード全体は以下。
LicenseWebpackPluginの設定に関して
- unacceptableLicenseTest
許可しないライセンス形態を配列で設定し、そのライセンスが含まれていたらtrueを返す＝NGにする、という設定 - outputFilename
デフォルトだと[name].licenses.txtというファイル名になるので、それを上書きするための設定（今回の設定では、./dist/meta/licenses.txtというファイルが作成される）
※excludedPackageTestを利用すれば、LicenseWebpackPluginがチェックできなかったライブラリ（license.txtがないライブラリ）は自分自身でライセンスを確認して、チェックの対象外にするという事もできるだろう。
module.exports = {
configureWebpack: {
plugins: [
new LicenseWebpackPlugin({
...
excludedPackageTest: (packageName) => ['@fontsource/roboto'].includes(packageName),
...
})
]
}
};
※今回利用していないオプションについては、公式に詳細が書かれている。
まとめとして
今回はwebpackを利用している場合に、依存ライブラリのライセンスチェックを行う方法についてみてきた。Node.jsの時とは違い、既存のbuild処理の中にライセンスのチェックが組み込めるのでより簡単だった。（Node.jsでもwebpackを利用してトランスパイルをする事はあるが（Node.jsでimport・export（ES6の構文）を使えるようにwebpack × Babelの設定をやってみたを参照）、その場合依存ライブラリ（node_modules）をbuild時にbundleする必要がないため（Webpack node modules externalsを参照）、今回のようなwebpackでbuildする際にライセンスのチェックまでやるという事ができなかった）。
※React等でもwebpackを使っていれば同じようにライセンスのチェックができるが、create-react-appでプロジェクトを作るとwebpack周りは隠蔽されるので少し勝手が違ってくるみたい（create-react-appで生成した環境でejectせずにWebpackのプラグインを試したいなどを参照）。