尝试在 vuejs 中获取我的本地 json 文件时未定义错误“要求”答案

【问题标题】：Error 'require' is not defined while trying to fetch my local json file in vuejs尝试在 vuejs 中获取我的本地 json 文件时未定义错误“要求”
【发布时间】：2021-01-06 13:52:16
【问题描述】：

我是 vuejs 的新手...
我试图获取存储在本地 JSON 文件中的 JSON 数据，但逻辑是决定要获取的 JSON 文件的数据是动态的。

我经常收到 'require' is not defined 的错误消息，我不知道如何解决它。
我检查了一些提到集成webpack 或browserify 的解决方案，但我不确定为什么需要集成其中任何一个！

<script>

var mylib = require(`../components/${this.$route.params.uuid}.json`)

export default {
    name: "BloePage",
    data() {
        return {
            blogcontent: mylib
        }
    }
}
</script>

我还尝试了以下方式来直接访问我的 JSON 文件，而不是让它保持动态。不过，我在这里收到的也是一样的……

export default {
    name: "BloePage",
    data() {
        return {
            blogcontent: require('../components/UUDD_WWAA_EEFF_EWWW_AAWW.json')
        }
    }
}

错误 -

16:26  error  'require' is not defined  no-undef

✖ 1 problem (1 error, 0 warnings)


 @ ./router/index.js 28:11-30:28
 @ ./main.js
 @ multi (webpack)-dev-server/client?http://192.168.43.171:8080&sockPath=/sockjs-node (webpack)/hot/dev-server.js ./main.js

【问题讨论】：

您是直接在浏览器中使用 Vue.js（通过
@ObnoxiousNerd 感谢您的提问。我不确定通过 CLI 捆绑源代码，所以我可能会直接在浏览器中使用 vue.js。
@ObnoxiousNerd 在 package.json 中有 "build": "vue-cli-service build" 选项添加到脚本中。所以我认为它将通过 CLI 捆绑代码。
但您知道require 在浏览器中不起作用，对吧？你需要这个库：requirejs.org/docs/download.html
@FlashThunder 我尝试在

标签： javascript vue.js frontend

【解决方案1】：

this 在export default 之外使用时不会引用 Vue 实例。

您必须使用 window.location 从 URL 中解析它，或者改用查询参数：

http://your-url?uuid=1

const params = new URLSearchParams(window.location.search);
const uuid = params.get('uuid');
console.log(uuid); // Output: 1

【讨论】：

我尝试直接在 export default 中使用 require 来代替 mylib。但它没有奏效。出现与之前相同的错误。感谢分享知识...
require 在export default 内部不起作用，我说的是this 并不是指您认为它在外部所做的事情
所以，this.$route.params.uuid 是 undefined
为什么require 会是undefined 取决于您的设置。你能发布任何相关的代码吗？
嗨@Daniel_Knights 我试图在