setup() VueJS 3 中的动态导入答案

【问题标题】：Dynamic import in setup() VueJS 3setup() VueJS 3 中的动态导入
【发布时间】：2022-08-16 22:21:37
【问题描述】：

我正在尝试在我的 Nuxt 3 项目中动态导入 .json 文件。我正在尝试做的事情：

文件夹名称 \"production\" 需要是动态的，变量也可以是 \"development\" 例如。所以我把名字放在一个变量中，并尝试在 import() 函数中使用它。

export default {
  async setup() {
    const pathName = \"production\"
    const textOndersteTextArtikel = await import(`~/data/text/${pathName}/artikel.json`)

    return {
      textOndersteTextArtikel: textOndersteTextArtikel
    }
  },

但后来我得到这个错误：

使用 + 符号转义导入也不起作用，并提供相同的错误。

const pathName = \"production\"
const textOndersteTextArtikel = await import(\"~/data/text/\"+pathName+\"/artikel.json\")

这样做的正确方法是什么？

标签： vue.js nuxt.js vuejs3 nuxtjs3

【解决方案1】：

不能导入json文件，导入导出json的js文件：创建 artikel.js 并在其中放置：

export default %your json%;

【讨论】：