webpack修改输出文件目录

const path = require('path')

module.exports = {
    entry: './src/main.js',

    output: {
        // 所有文件的输出路径(一般要修改配置不会直接在这里改, 在filename改)
        path: path.resolve(__dirname, 'dist'),
        // 入口文件打包输出名(这里案例处理js的)
        filename: 'static/js/main.js'
    },

    module: {
        rules: [
            // 处理图片资源
            {
                test: /\.(png|jpe?g|gif|webp|svg)$/,
                type: "asset",
                parser: {
                    dataUrlCondition: {
                        // 小于10kb的图片转base64
                        // 优点: 减少请求数量, 缺点: 体积会更大
                        maxSize: 1 * 1024 // 10kb
                    }
                },

                // 修改图片输出文件目录
                generator: {
                // 输出图片名称
                // hash对应图片名哈希值,ext: 扩展名,query: 携带的参数
                // filename: "static/images/[hash][ext][query]" // [hash]代表显示所有哈希值, 下面写法是取前十位哈希值, 取前十个就够了
                filename: "static/images/[hash:10][ext][query]"
            }
            }
        ]
    },

    plugins: [],

    mode: 'development'
}