【Windows】「You can limit the size of your bundles by using import() or require.ensure to lazy load some parts of your application.」警告の対処法

昨日に引き続き、本日も webpack で発生したエラー・警告の対処法についてです。
昨日は「Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema.」というエラーの対処法でしたが、今回の警告はこちらのエラーを解消した後に発生したものです。

警告なので、別に修正が必須ではないのですが、気になるので対応しました。
警告文は「You can limit the size of your bundles by using import() or require.ensure to lazy load some parts of your application.」というものです。

参考にさせていただいた記事はこちらから。

Webpack2のパフォーマンス警告を制御する – Qiita
https://qiita.com/terrierscript/items/f840b5ccff0c0be7420a

ビルドした際にファイルサイズがデフォルト設定よりも大きいです!という警告のようです。

 

対応策としては、下記の方法があります。

  1. 警告そのものを表示させないように設定する
  2. ファイルサイズ警告の閾値を変更する

私は 2の方を採用しました。
webpack.config.js に 下記を追加します。

module.exports = {
  ...
  performance: {
    maxEntrypointSize: [ファイルサイズの許容値],
    maxAssetSize: [ファイルサイズの許容値]
  }
}

どちらの値もデフォルト値は 250,000(=250kb)です。
警告になったファイルサイズによって適宜変更してください。
なお、カンマは不要ですのでお気を付けください。
あとは、npm run build を実行すればOKです。
閾値を超えなければ、警告は発生しません。

 

以上、npm run build を実行した際の「You can limit the size of your bundles by using import() or require.ensure to lazy load some parts of your application.」警告の対処方法でした。
ご参考になれば幸いです。

>株式会社シーポイントラボ

株式会社シーポイントラボ

TEL:053-543-9889
営業時間:9:00~18:00(月〜金)
住所:〒432-8003
   静岡県浜松市中央区和地山3-1-7
   浜松イノベーションキューブ 315
※ご来社の際はインターホンで「316」をお呼びください

CTR IMG