varlet-nuxt-template/nuxt.config.ts at main · varletjs/varlet-nuxt-template · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
// https://nuxt.com/docs/api/configuration/nuxt-config
export default defineNuxtConfig({
  app: {
    head: {
      meta: [
        { name: 'apple-mobile-web-app-status-bar-style', content: 'black-translucent' },
      ],
      charset: 'utf-8',
      viewport: 'width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, viewport-fit=cover',
    },
    pageTransition: { name: 'page', mode: 'out-in' },
    layoutTransition: { name: 'layout', mode: 'out-in' }
  },
  devServer: { port: 8888 },
  devtools: { enabled: true },
  modules: ['@unocss/nuxt', '@vueuse/nuxt', 'dayjs-nuxt', '@varlet/nuxt', "@nuxtjs/i18n"],
  imports: {
    dirs: [
      './composables/useMobile',
    ],
    injectAtEnd: true,
  },
  css: [
    '~/styles/global.css',
  ],
  i18n: {
    vueI18n: './i18n',
  },
  vite: {
    vue: {
      template: {
        transformAssetUrls: {
          img: ['src'],
          video: ['src'],
          audio: ['src'],
          'var-image': ['src'],
          'var-avatar': ['src'],
          'var-card': ['src'],
          'var-app-bar': ['image']
        }
      }
    }
  },
  postcss: {
    plugins: {
      'postcss-px-to-viewport': {
        viewportWidth: 375,
        viewportUnit: 'vmin',
        fontViewportUnit: 'vmin',
        unitPrecision: 6,
        unitToConvert: 'px',
        propList: ['*'],
        selectorBlackList: ['var-elevation']
      },
    }
  }
})