Ассеты в JavaScript бандлах Webpack
Давайте настроим ассеты для .png
файлов:
webpack.config.jsexport default {
entry: "./src/index.js",
output: {
filename: "bundle.js",
path: path.resolve("dist"),
},
module: {
rules: [
{
test: /\.png$/,
type: "asset/resource",
},
],
},
plugins: [new HtmlWebpackPlugin()],
};
Подключим .png
файл к точке входа:
/src/index.jsimport img from './images/main.png';
В переменную img
попадет новый путь к файлу картинки:
/src/index.jsconsole.log(img);