import { dirname, resolve } from 'node:path'
import { fileURLToPath } from 'node:url'
import AutoImport from 'unplugin-auto-import/vite'
import { NaiveUiResolver } from 'unplugin-vue-components/resolvers'
import Components from 'unplugin-vue-components/vite'
import { pwa } from './app/config/pwa'
import { appDescription } from './app/constants/index'

const __filename = fileURLToPath(import.meta.url)
const __dirname = dirname(__filename)

export default defineNuxtConfig({
  modules: [
    '@vueuse/nuxt',
    '@pinia/nuxt',
    '@nuxtjs/tailwindcss',
    '@nuxtjs/color-mode',
    '@vite-pwa/nuxt',
    '@nuxt/eslint',
    'nuxtjs-naive-ui',
    '@pinia-plugin-persistedstate/nuxt',
  ],

  ssr: true,

  devtools: { enabled: true },

  app: {
    head: {
      viewport: 'width=device-width,initial-scale=1',
      link: [
        { rel: 'icon', href: '/favicon.ico', sizes: 'any' },
        { rel: 'icon', type: 'image/svg+xml', href: '/nuxt.svg' },
        { rel: 'apple-touch-icon', href: '/apple-touch-icon.png' },
      ],
      meta: [
        { name: 'viewport', content: 'width=device-width, initial-scale=1' },
        { name: 'description', content: appDescription },
        { name: 'apple-mobile-web-app-status-bar-style', content: 'black-translucent' },
        { name: 'theme-color', media: '(prefers-color-scheme: light)', content: 'white' },
        { name: 'theme-color', media: '(prefers-color-scheme: dark)', content: '#222222' },
      ],
    },
  },

  css: ['assets/scss/main.scss'],

  colorMode: { classSuffix: '' },

  alias: {
    '@styles': './assets/styles',
    'assets': './assets',
    '@assets': './assets',
    'public': './public',
    '@': resolve(__dirname, './app'),
    '~': resolve(__dirname, './app'),
    '@constants': resolve(__dirname, './app/constants'),
  },

  build: {
    transpile: process.env.NODE_ENV === 'production'
      ? ['naive-ui', 'vueuc', '@css-render/vue3-ssr', '@juggle/resize-observer']
      : ['@juggle/resize-observer'],
  },

  routeRules: {
    '/': { redirect: '/model-square' },
    '/personal-center': { ssr: true },
    '/model-square': { ssr: true },
    '/member-center': { ssr: true },
  },

  future: { compatibilityVersion: 4 },

  experimental: {
    payloadExtraction: false,
    renderJsonPayloads: true,
    typedPages: true,
  },

  compatibilityDate: '2025-01-23',

  nitro: {
    devProxy: {
      '/api': {
        // target: 'http://1.13.246.108:8080', 线上
        // target: 'http://192.168.2.22:8080', // 代
        target: 'http://192.168.1.69:8080', // 嗨
        changeOrigin: true,
        prependPath: true,
      },
    },
    esbuild: {
      options: { target: 'esnext' },
    },
    prerender: {
      crawlLinks: false,
      routes: ['/'],
      ignore: ['/hi'],
    },
  },

  vite: {
    define: {
      'process.env.DEBUG': false,
    },
    plugins: [
      AutoImport({
        imports: [
          {
            'naive-ui': [
              'useDialog',
              'useMessage',
              'useNotification',
              'useLoadingBar',
            ],
          },
        ],
      }),
      Components({
        resolvers: [NaiveUiResolver()],
      }),
    ],
    css: {
      preprocessorOptions: {
        scss: {
          additionalData: '@use "@assets/scss/_variables.scss";', // 使用 @import 而不是 @use
        },
      },
    },
    // optimizeDeps: {
    //   include: ['date-fns-tz/esm/formatInTimeZone']
    // }
  },

  eslint: {
    config: {
      standalone: false,
      nuxt: {
        sortConfigKeys: true,
      },
    },
  },

  pinia: {
    autoImports: ['defineStore', 'storeToRefs'],
  },

  pwa,

  tailwindcss: {
    cssPath: 'assets/scss/_tailwind.scss',
    configPath: 'tailwind.config.js',
    exposeConfig: false,
    viewer: true,
  },
})