性能

这些选项允许您控制 webpack 如何通知您超过特定文件限制的资产和入口点。此功能的灵感来自 webpack 性能预算 的理念。

performance

object

配置性能提示的显示方式。例如，如果你有一个超过 250kb 的资产，webpack 将发出一个警告来通知你。

performance.assetFilter

function(assetFilename) => boolean

此属性允许 webpack 控制哪些文件用于计算性能提示。默认函数是

function assetFilter(assetFilename) {
  return !/\.map$/.test(assetFilename);
}

你可以通过传入自己的函数来覆盖此属性

module.exports = {
  //...
  performance: {
    assetFilter: function (assetFilename) {
      return assetFilename.endsWith('.js');
    },
  },
};

上面的示例将仅基于 .js 文件为你提供性能提示。

performance.hints

string = 'warning': 'error' | 'warning' boolean: false

打开/关闭提示。此外，当发现提示时，告诉 webpack 抛出错误或警告。

给定一个超过 250kb 的资产

module.exports = {
  //...
  performance: {
    hints: false,
  },
};

不显示提示警告或错误。

module.exports = {
  //...
  performance: {
    hints: 'warning',
  },
};

将显示一个警告，通知你一个大型资产。我们建议在开发环境中使用类似这样的东西。

module.exports = {
  //...
  performance: {
    hints: 'error',
  },
};

将显示一个错误，通知你一个大型资产。我们建议在生产构建期间使用 hints: "error"，以帮助防止部署过大的生产包，影响网页性能。

performance.maxAssetSize

number = 250000

资产是 webpack 发出的任何文件。此选项控制 webpack 何时根据单个资产大小（以字节为单位）发出性能提示。

module.exports = {
  //...
  performance: {
    maxAssetSize: 100000,
  },
};

performance.maxEntrypointSize

number = 250000

入口点表示在特定入口的初始加载时间内将利用的所有资产。此选项控制 webpack 何时应根据最大入口点大小（以字节为单位）发出性能提示。

module.exports = {
  //...
  performance: {
    maxEntrypointSize: 400000,
  },
};