assetRules.js 1.18 KB
Newer Older
邓晓峰's avatar
邓晓峰 committed
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51
// eslint-disable-next-line import/no-unresolved

module.exports = async function addAssetRules(opts) {
  const { config, userConfig } = opts;
  const inlineLimit = parseInt(userConfig.inlineLimit || '10000', 10);
  const rule = config.module.rule('asset');

  rule
    .oneOf('avif')
    .test(/\.avif$/)
    .type('asset')
    .mimetype('image/avif')
    .parser({
      dataUrlCondition: {
        maxSize: inlineLimit,
      },
    })
    .generator({
      filename: `${opts.staticPathPrefix}[name].[hash:8].[ext]`,
    });

  rule
    .oneOf('image')
    .test(/\.(bmp|gif|jpg|jpeg|png)$/)
    .type('asset')
    .parser({
      dataUrlCondition: {
        maxSize: inlineLimit,
      },
    })
    .generator({
      filename: `${opts.staticPathPrefix}[name].[hash:8].[ext]`,
    });

  const fallback = rule
    .oneOf('fallback')
    .exclude.add(/^$/) /* handle data: resources */
    .add(/\.(js|mjs|jsx|ts|tsx)$/)
    .add(/\.(css|less|sass|scss|stylus)$/)
    .add(/\.html$/)
    .add(/\.json$/);
  if (userConfig.mdx) {
    fallback.add(/\.mdx?$/);
  }
  fallback
    .end()
    .type('asset/resource')
    .generator({
      filename: `${opts.staticPathPrefix}[name].[hash:8].[ext]`,
    });
};