/* eslint-disable @typescript-eslint/no-unused-vars */

/**
 * @description vue.config.js全局配置
 */

const {
    baseURL,
    title,
    devPort,
    assetsDir,
    outputDir,
    lintOnSave,
    publicPath,
    transpileDependencies,
} = require('./src/config')
const dayjs = require('dayjs')
const pkg = require('./package.json')

const { resolve, relative } = require('path')
const { defineConfig } = require('@vue/cli-service')
const {
    createVuePlugin,
    createChainWebpack,
} = require('./library/build/index.ts')

const pc = require('picocolors')

const info = {
    ...pkg,
    lastBuildTime: dayjs().format('YYYY-MM-DD HH:mm:ss'),
}

process.env.VUE_APP_TITLE = title
process.env.VUE_APP_AUTHOR = pkg.author
process.env.VUE_APP_INFO = JSON.stringify(info)
process.env.VUE_APP_UPDATE_TIME = info.lastBuildTime
process.env.VUE_APP_GITHUB_USER_NAME = process.env.VUE_GITHUB_USER_NAME
process.env.VUE_APP_RANDOM = `${info.lastBuildTime}-${process.env.VUE_GITHUB_USER_NAME}`

module.exports = defineConfig({
    publicPath,
    assetsDir,
    outputDir,
    lintOnSave,
    transpileDependencies,
    parallel: true, // 启用多进程处理
    devServer: {
        compress: true,
        client: {
            progress: false,
            overlay: {
                warnings: false,
                errors: true,
            },
        },
        hot: true,
        port: devPort,
        setupMiddlewares: require('./mock'),
        // 注释掉的地方是前端配置代理访问后端的示例，如无特别需求，不建议使用！！！
        // baseURL必须为/xxx，而不是后端服务器，请先了解代理逻辑，再设置前端代理
        // ！！！一定要注意！！！
        // 1、这里配置了跨域及代理只针对开发环境生效
        // 2、不建议你在前端配置跨域，建议你后端配置Allow-Origin,Method,Headers，放行token字段，一步到位
        // 3、后端配置了跨域，就不需要前端再配置，会发生Origin冲突
        // 4、webpack5版本前端配置代理无法与mock同时使用，如果一定要用前端代理，需注释setupMiddlewares: require('./mock')
        // proxy: {
        //   [baseURL]: {
        //     target: `https://xxx.com`,
        //     ws: true,
        //     changeOrigin: true,
        //     pathRewrite: {
        //       ['^' + baseURL]: '',
        //     },
        //   },
        // },
    },
    pwa: {
        workboxOptions: {
            skipWaiting: true,
            clientsClaim: true,
        },
        themeColor: '#ffffff',
        msTileColor: '#ffffff',
        appleMobileWebAppCapable: 'yes',
        appleMobileWebAppStatusBarStyle: 'black',
        manifestOptions: {
            name: 'Vue Admin Better - Admin Plus',
            short_name: 'Admin Plus',
            background_color: '#ffffff',
        },
    },
    configureWebpack() {
        return {
            cache: {
                type: 'filesystem',
                buildDependencies: {
                    config: [__filename],
                },
                version: pkg.version, // 添加版本号，版本变更时自动刷新缓存
            },
            resolve: {
                alias: {
                    '~': resolve(__dirname, '.'),
                    '@': resolve(__dirname, 'src'),
                    '/#': resolve(__dirname, 'types'),
                    '@vab': resolve(__dirname, 'library'),
                    '@gp': resolve('library/plugins/vab'),
                },
                fallback: {
                    fs: false,
                    path: require.resolve('path-browserify'),
                },
            },
            plugins: createVuePlugin(),
            performance: {
                hints: false,
            },
        }
    },
    chainWebpack(config) {
        //为了防止忘记配置而造成项目无法打包，请保留以下提示
        if (
            process.env.NODE_ENV === 'production' &&
            (process['env'].VUE_GITHUB_USER_NAME === 'test' ||
                process['env'].VUE_APP_SECRET_KEY === 'preview')
        ) {
            console.log(
                `\n\n${pc.red(
                    '检测到您的用户名或key未配置，key在购买时通过邮件邀请函发放，如您已购买请仔细阅读文档并进行配置，配置完成后方可打包使用。购买地址：https://vuejs-core.cn/authorization'
                )}\n`
            )
            process.exit()
        }

        // 优化构建速度
        config.module.rule('vue').use('thread-loader').loader('thread-loader')

        // 优化构建速度，跳过node_modules中已编译的文件
        config.module
            .rule('js')
            .exclude.add(/node_modules\/core-js/)
            .end()

        createChainWebpack(process.env.NODE_ENV, config)
    },
    runtimeCompiler: false,
    productionSourceMap: false,
    css: {
        sourceMap: false,
        extract:
            process.env.NODE_ENV === 'production'
                ? {
                      ignoreOrder: true,
                  }
                : false,
        loaderOptions: {
            sass: {
                sassOptions: { outputStyle: 'expanded' },
                additionalData(content, { rootContext, resourcePath }) {
                    const relativePath = relative(rootContext, resourcePath)
                    if (
                        relativePath.replace(/\\/g, '/') !==
                        'library/styles/variables/variables.module.scss'
                    )
                        return `@use "~@vab/styles/variables/variables.module.scss" as *;${content}`
                    return content
                },
            },
        },
    },
})