Webpack에서 인라인 assets 설정하기

이제 인라인 assets을 시도해 봅시다. 이러한 설정을 하면 이미지가 base64로 변환될 것입니다. 시도해 보겠습니다:

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

.svg 이미지가 인라인 assets이 되도록 설정하세요. 어떤 이미지 예제를 통해 여러분의 설정을 확인하세요.