папка с файлами изображений / активов / изображений исчезает при сборке с помощью веб-пакета

Question

* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *

* * * * * * * * * * * * * * * *1004*

изображения не найдены в . / Assets

Я не знаю, зачем портить изображение. Это изображение использует css фон

Это мой webpack.common. js

const path = require('path')
const webpack = require('webpack')
const HtmlWebpackPlugin = require('html-webpack-plugin')
const {CleanWebpackPlugin} = require('clean-webpack-plugin')
const MiniCssExtractPlugin = require('mini-css-extract-plugin');

// Production
const PROD_URL = path.join(__dirname, "./dist");
const PROD_ASSETS_DIR = PROD_URL+'/assets';

module.exports = {
    entry: './src/Index.js',
    plugins: [
        new CleanWebpackPlugin(),
        new HtmlWebpackPlugin({
            title: '我们开始旅行吧',
            template: "./index.html"
        })
    ],
  module: {
    rules: [
      {
        test: /\.(js|jsx)$/,
        use: 'babel-loader',
        exclude: /node_modules/,
      },
      {
        test: /\.s[ac]ss$/i,
        use: [
          'style-loader',
          'css-loader',
          'sass-loader',
        ],
      },
      {
        test: /\.(png|jpg|gif)$/,
        use: [
          {
            loader:"url-loader",
            // loader: 'url-loader?limit=8192&name=assets/images/[hash:8].[name].[ext]',
            options: {
              limit: 8192,
              outputPath: "dist/asstes/",
              publicPath: "/dist/" 
            },
          }
        ]
      }
    ]
  }
}

Это мой webpack.prod. js

const merge = require('webpack-merge')
const webpackConfig = require('./webpack.config.js')
const UglifyJSPlugin = require('uglifyjs-webpack-plugin');

module.exports = merge(webpackConfig, {
    devtool: 'inline-source-map',
    plugins: [
        new UglifyJSPlugin()
    ]
})

Answer 1

Если я вас правильно понял, вы потеряете эту папку: «./dist/assets/images». Вот ответ.

Вы используете CleanWebpackPlugin. Он удаляет все содержимое из папки «./dist» перед сборкой. После этого загрузчик URL собирает и помещает все изображения в папку ./dist/assets. Вот почему ваша папка "images" исчезает.