在使用moment.js時,由於預設的moment庫會引入全部的語言資原始檔,導致最後打包時體積非常大,這時我們可以通過webpack自帶的外掛來精簡掉這些語言資原始檔

使用 IgnorePlugin

以下這段程式碼加到webpack的config中,可以在打包時排除moment中所有的locale下的檔案

const webpack = require('webpack');
module.exports = {
  //...
  plugins: [
    // Ignore all locale files of moment.js
    new webpack.IgnorePlugin(/^\.\/locale$/
 
, /moment$/),
  ],
};

如果你只需要載入某些語言包,也可以在需要的時候手動引用一次

const moment = require('moment');
require('moment/locale/ja');

moment.locale('ja');
...

經查閱,IgnorePlugin 這個外掛的功能是防止在 import 或 require 呼叫時，生成以下正則表示式匹配的模組：

• requestRegExp 匹配(test)資源請求路徑的正則表示式。
• contextRegExp （可選）匹配(test)資源上下文（目錄）的正則表示式。

new webpack.IgnorePlugin(requestRegExp, [contextRegExp])