Unexpected token 'error' when using unoplugin-vue-i18n

[Nicolas-Nmedia]

Hi there !

So I've been getting this error whenever I try to run my Nuxt app and the error disappears as soon as I remove the vite plugin from nuxt.config.ts. I'd love to be able to debug it myself but have no idea where to start looking.

Here's what my nuxt.config.ts looks like

import VueI18nPlugin from '@intlify/unplugin-vue-i18n'
import path from 'path'

export default defineNuxtConfig({
  app: {
    rootTag: "body"
  },
  compression: {
    algorithm: "brotliCompress",
    filter: null,
  },
  css: [
    "@/assets/style/main.scss"
  ],
  googleFonts: {
    download: false,
    families: {
      "Open+Sans": true,
      Roboto: true
    },
    subsets: [
      "latin"
    ]
  },
  "graphql-client": {
    documentPaths: [
      "./graphql"
    ]
  },
  i18n: {
    defaultLocale: "fr-ca",
    detectBrowserLanguage: {
      cookieKey: "i18n_redirected",
      redirectOn: "root",
      useCookie: true
    },
    langDir: "locales",
    lazy: true,
    locales: [
      {
        code: "en-ca",
        file: "en-ca.json"
      },
      {
        code: "fr-ca",
        file: "fr-ca.json"
      }
    ],
    vueI18n: {
      legacy: false
    }
  },
  modules: [
    "@nuxt/image-edge",
    "@nuxt-modules/compression",
    "@nuxtjs/google-fonts",
    "@nuxtjs/i18n",
    "nuxt-icons",
    "@pinia/nuxt",
    "@funken-studio/sitemap-nuxt-3",
    //"nuxt-graphql-client"
  ],
  runtimeConfig: {
    public: {
      GQL_HOST: 'http://localhost:1337/graphql', // overwritten by process.env.GQL_HOST
    }
  },
  sitemap: {
    generateOnBuild: true
  },
  vite: {
    css: {
      preprocessorOptions: {
        scss: {
          additionalData: `
            @use "./assets/style/global/_variables.scss" as var;
            @use "./assets/style/global/_functions.scss" as func;
            @use "./assets/style/global/_mixins.scss" as mix;
          `
        }
      }
    },
    plugins: [
      VueI18nPlugin.vite({
        defaultSFCLang: "json",
        include: path.resolve(__dirname, 'src/locales/**')
      })
    ]
  }
})

And here's my package.json

{
  "private": true,
  "scripts": {
    "build": "nuxt build",
    "dev": "nuxt dev",
    "start": "node .output/server/index.mjs",
    "generate": "nuxt generate",
    "preview": "nuxt preview",
    "postinstall": "nuxt prepare"
  },
  "devDependencies": {
    "@intlify/unplugin-vue-i18n": "^0.9.1",
    "@nuxt-modules/compression": "^0.1.0",
    "@nuxt/image-edge": "^1.0.0-27919678.2f5b64b",
    "@nuxt/types": "^2.16.0",
    "@nuxtjs/google-fonts": "^3.0.0-1",
    "@nuxtjs/i18n": "^8.0.0-beta.9",
    "@types/google-fonts": "^1.0.0",
    "@types/node": "^18.13.0",
    "nuxt": "^3.1.2",
    "nuxt-icons": "^3.1.0",
    "sass": "^1.58.0",
    "sass-loader": "^13.2.0",
    "vite-plugin-compression": "^0.5.1"
  },
  "dependencies": {
    "@funken-studio/sitemap-nuxt-3": "^4.0.4",
    "@pinia/nuxt": "^0.4.6",
    "nuxt-graphql-client": "^0.2.25",
    "vite": "^4.1.4"
  },
  "overrides": {
    "vue": "latest"
  }
}

[Nicolas-Nmedia]

The error is thrown when trying to import json files, it seems