const path = require("path");

const resolve = (dir) => {
    return path.join(__dirname, dir);
};

// 项目部署基础
const BASE_URL = process.env.NODE_ENV === "development" ? "/" : "/";

const sourceMap = process.env.NODE_ENV === "development";

module.exports = {
    publicPath: BASE_URL,
    // 如果你不需要使用eslint，把lintOnSave设为false即可
    lintOnSave: false,
    chainWebpack: (config) => {
        config.resolve.alias.set("@", resolve("src"));
        config.resolve.alias.set("_c", resolve("src/components"));

        // 正确处理 SVG 文件
        config.module.rule('svg')
            .test(/\.svg$/)
            .use('file-loader')
            .loader('file-loader')
            .options({
                name: 'assets/svg/[name].[hash:8].[ext]'
            });

        // 处理图片文件（排除 SVG）
        config.module.rule('images')
            .test(/\.(png|jpe?g|gif)(\?.*)?$/)
            .use('url-loader')
            .loader('url-loader')
            .options({
                limit: 10000,
                esModule: false,
                outputPath: "images/"
            });

        // 图片压缩（仅对 PNG、JPG、GIF）
        config.module.rule('images')
            .test(/\.(png|jpe?g|gif)(\?.*)?$/)
            .use('image-webpack-loader')
            .loader('image-webpack-loader')
            .options({
                bypassOnDebug: true,
                mozjpeg: {
                    progressive: true,
                    quality: 65
                },
                optipng: {
                    enabled: false,
                },
                pngquant: {
                    quality: [0.65, 0.90],
                    speed: 4
                },
                gifsicle: {
                    interlaced: false,
                },
                webp: {
                    quality: 75
                }
            });
    },

    configureWebpack: {
        output: {
            filename: "js/[hash].js",
        },
    },
    
    // PostCSS 配置
    css: {
        loaderOptions: {
            postcss: {
                postcssOptions: {
                    plugins: [
                        require('autoprefixer'),
                        require('postcss-pxtorem')({
                            rootValue: 16,
                            propList: ['*'],
                            selectorBlackList: [],
                            replace: true,
                            mediaQuery: false,
                            minPixelValue: 1,
                            exclude: /node_modules/i
                        })
                    ]
                }
            },
            // LESS 配置
            less: {
                lessOptions: {
                    javascriptEnabled: true,
                    modifyVars: {
                        // 可以在这里定义全局LESS变量
                        '@primary-color': '#3498db',
                        '@success-color': '#52c41a',
                        '@warning-color': '#faad14',
                        '@error-color': '#f5222d',
                        '@font-size-base': '14px',
                        '@heading-color': '#262626',
                        '@text-color': '#595959',
                        '@text-color-secondary': '#8c8c8c',
                        '@disabled-color': '#bfbfbf',
                        '@border-radius-base': '4px',
                        '@border-color-base': '#d9d9d9',
                        '@box-shadow-base': '0 2px 8px rgba(0, 0, 0, 0.15)'
                    }
                }
            }
        }
    },
    // 设为false打包时不生成.map文件
    productionSourceMap: sourceMap,
};