Webpack file-loader not copying the images over

JavaScript
1

I am following this great tutorials about webpack, now I am trying what author says about file-loader on 1:23:10 but for me it is not working. following is the webpack config.

var HtmlWebpackPlugin = require('html-webpack-plugin');
const path = require("path");
module.exports = {
    entry: "./src/index.js",
    plugins: [new HtmlWebpackPlugin({
        template: "./src/template.html"
    })],
    module: {
        rules: [
            {
                test: /\.scss$/,
                use: ['style-loader', 'css-loader', 'sass-loader']
            },
            {
                test: /\.html$/,
                use: ["html-loader"]
            },
            {
                test: /\.(jpg|gif)$/,
                use: {
                    loader: "file-loader",
                    options: {
                        name: "[name].[hash].[ext]",
                        outputPath: "images"
                    }
                }
            }
        ],
    }
}```
2

Hi @mahassan,

Are you following along with the tutorial exactly? I noticed some file extensions missing from your test compared to what is shown at the timestamp you had mentioned in the video. Also, are you sure the images you are expecting to be copied are referenced in the template file (./src/template.html) as noted in the video?

3

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.