Answer the question
In order to leave comments, you need to log in
Webpack not compiling images?
Webpack does not compile images to dist
Images are in src/img
Webpack Code:
const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const { CleanWebpackPlugin } = require('clean-webpack-plugin');
const webpack = require('webpack');
module.exports = {
entry: {
main: path.resolve(__dirname, './src/index.ts'),
},
output: {
path: path.resolve(__dirname, './dist'),
filename: 'bundle.[hash].js',
},
resolve: {
alias: {
images: path.resolve(__dirname, 'src/assets/img/'),
},
},
plugins: [
new HtmlWebpackPlugin({
template: path.resolve(__dirname, './src/template.html'), // шаблон
filename: 'index.html', // название выходного файла
}),
new CleanWebpackPlugin(),
new webpack.HotModuleReplacementPlugin(),
],
mode: 'development',
devServer: {
historyApiFallback: true,
contentBase: path.resolve(__dirname, './dist'),
open: true,
compress: true,
hot: true,
port: 8000,
},
resolve: {
extensions: ['.ts', '.js'],
},
module: {
rules: [
{
test: /\.ts$/,
exclude: /node_modules/,
use: {
loader: 'ts-loader',
},
},
// JavaScript
{
test: /\.js$/,
exclude: /node_modules/,
use: ['babel-loader'],
},
{
test: /\.(gif|png|jpg|jpeg|svg)?$/,
loader: 'file-loader',
options: {
name: 'assets/img/[name].[ext]',
},
},
// шрифты и SVG
{
test: /\.(woff(2)?|eot|ttf|otf|svg|)$/,
type: 'asset/inline',
},
// CSS, PostCSS, Sass
{
test: /\.(scss|css)$/,
use: ['style-loader', 'css-loader', 'postcss-loader', 'sass-loader'],
},
],
},
};
Answer the question
In order to leave comments, you need to log in
Didn't find what you were looking for?
Ask your questionAsk a Question
731 491 924 answers to any question