javascript - 插件 :vite:import-analysis - Failed to parse source for import analysis because the content contains invalid JS syntax. - Vue 3

Question

我已经将我的项目从 Vite 2.x 更新到 Vite 3.0.2，突然出现这个错误:

[plugin:vite:import-analysis] Failed to parse source for importanalysis because the content contains invalid JS syntax. If you areusing JSX, make sure to name the file with the .jsx or .tsx extension.

/Volumes/Disk/Web/wce-system/src/i18n.js:51:20

i18n.js 文件没有任何问题，因为它在 Vite 2.x 上运行良好，但我将代码放在这里以备不时之需:

import { nextTick } from "vue"
import { createI18n } from "vue-i18n"
import axios from "axios"
import tr from "@/locales/tr.json"
import en from "@/locales/en.json"

export const SUPPORT_LOCALES = ["tr", "en"]

export function setupI18n(options = { locale: "tr" }) {
const i18n = createI18n(options)
setI18nLanguage(i18n, options.locale)
  return i18n
}

export function setI18nLanguage(i18n, locale, url) {
  if (i18n.mode === "legacy") {
  i18n.global.locale = locale
} else {
  i18n.global.locale.value = locale
}       
axios.defaults.headers.common["Accept-Language"] = locale
document.querySelector("html").setAttribute("lang", locale)
}

export async function loadLocaleMessages(i18n, locale) {
 const messages = await import(
/* webpackChunkName: "locale-[request]" */ `./locales/${locale}.json`
)

i18n.global.setLocaleMessage(locale, messages.default)
 return nextTick()
}

const i18n = createI18n({
  legacy: false,
  locale: "tr",
  fallbackLocale: "tr",
  globalInjection: true,
  messages: {
    tr,
    en,
  },
})

export default i18n

Answer 1

所以我想通了。这一行:

const messages = await import(
  /* webpackChunkName: "locale-[request]" */ `./locales/${locale}.json`
)

应该是:

 const messages = await import(`./locales/${locale}.json`)

我无法解释为什么会这样，但我会在下面留下有关问题的链接。

Vite dynamic imports

This可能有助于进一步调查