Ассетҳои умумӣ дар Webpack

Акнун биёед ассетҳои умумӣро санҷем. Биёед тавре созем, ки тасвирҳое, ки хурдтар аз 8kb ҳастанд, ба base64 табдил дода шаванд, ва тасвирҳои калонтар аз ин андоза ба файл нусхабардорӣ карда шаванд:

webpack.config.jsexport default {
  entry: './src/index.js',
  output: {
    filename: 'bundle.js',
    path: path.resolve('dist'),
  },
  module: {
    rules: [
      {
        test: /\.png$/,
        type: 'asset',
      }
    ]
  },
  plugins: [
    new HtmlWebpackPlugin(),
  ],
};

Метеван маҳдудияти андозаи тасвирро тағир диҳед. Барои мисол, маҳдудияти 4kb гузорем:

webpack.config.jsexport default {
  entry: './src/index.js',
  output: {
    filename: 'bundle.js',
    path: path.resolve('dist'),
  },
  module: {
    rules: [
      {
        test: /\.png$/,
        type: 'asset',
        parser: {
          dataUrlCondition: {
            maxSize: 4 * 1024 // 4kb
          }
        }
      }
    ]
  },
  plugins: [
    new HtmlWebpackPlugin(),
  ],
};