import dom from '/public/setInformation.json'在vue中引用json文件打包之后修改setInformation.json不生效
时间: 2024-03-26 12:40:06 浏览: 27
这是因为在 Vue 打包之后,JSON 文件会被打包成一个静态文件,无法直接修改。如果你需要在运行时修改 JSON 文件,你可以通过 Ajax 或者 Axios 请求服务器上的 JSON 文件,并将其存储在 Vue 组件的 data 属性中,然后通过 Vue 的数据响应机制来更新视图。
以下是一个简单的示例代码:
```
<template>
<div>{{ information }}</div>
</template>
<script>
import axios from 'axios'
export default {
data() {
return {
information: null
}
},
mounted() {
this.loadInformation()
},
methods: {
async loadInformation() {
const response = await axios.get('/public/setInformation.json')
this.information = response.data
}
}
}
</script>
```
在这个示例中,我们通过 Axios 请求服务器上的 JSON 文件,然后将其存储在组件的 data 属性中的 information 字段中,并在模板中使用它来显示数据。这样,当 JSON 文件发生变化时,我们只需要重新请求数据即可更新视图。
相关问题
vue3ts出现找不到文件“@vue/tsconfig/tsconfig.dom.json”
回答: 出现找不到文件“@vue/tsconfig/tsconfig.dom.json”的问题可能是由于配置文件的错误或缺失引起的。根据提供的引用内容,可以尝试以下解决方案来解决这个问题。
首先,根据引用\[1\]中的解决方案,可以尝试修改tsconfig.json文件中的"extends"字段,将其改为"extends": "@tsconfig/node18/tsconfig.json"。这样可以使用"@tsconfig/node18"的配置文件来替代"@vue/tsconfig/tsconfig.dom.json"。
其次,根据引用\[2\]中的描述,可能是因为缺少了"@tsconfig/react-native/tsconfig.json"文件导致的错误。可以尝试安装"@tsconfig/react-native"依赖,并确保该文件存在于项目中。
最后,根据引用\[3\]中的内容,可以检查tsconfig.json文件中的"references"字段,确保引用了正确的配置文件路径。同时,还可以检查"include"字段中是否包含了需要的文件路径。
综上所述,通过修改tsconfig.json文件的配置,安装缺失的依赖,并检查文件路径是否正确,可以解决找不到文件“@vue/tsconfig/tsconfig.dom.json”的问题。
#### 引用[.reference_title]
- *1* [Cannot find base config file @vue/tsconfig/tsconfig.web.json](https://blog.csdn.net/goodcto/article/details/131509032)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^control_2,239^v3^insert_chatgpt"}} ] [.reference_item]
- *2* [React Native v0.70 踩坑:@tsconfig/react-native/tsconfig.json Not Found](https://blog.csdn.net/peade/article/details/126937784)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^control_2,239^v3^insert_chatgpt"}} ] [.reference_item]
- *3* [vue3+vite项目中tsconfig.json / tsconfig.node.json 配置](https://blog.csdn.net/qq_42761482/article/details/128797960)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^control_2,239^v3^insert_chatgpt"}} ] [.reference_item]
[ .reference_list ]
找不到文件“@vue/tsconfig/tsconfig.dom.json”
您在提到的文件路径中似乎有一个错误。"@vue/tsconfig/tsconfig.dom.json" 文件是 Vue.js 项目中的一个 TypeScript 配置文件,用于在浏览器环境中编译 TypeScript 代码。请确保您的项目结构和文件路径是正确的。
首先,请确认您是否已经在项目根目录下安装了必要的依赖项。如果没有,请运行以下命令安装它们:
```
npm install
```
接下来,请确保您的项目中存在 "@vue/tsconfig" 这个文件夹,并且在该文件夹下存在 "tsconfig.dom.json" 文件。如果没有,请尝试重新安装 Vue.js 相关的依赖项,或者更新您的项目配置。
如果您仍然无法找到该文件,请检查您的项目结构和文件路径,可能是由于文件被移动或删除导致无法找到。您可以尝试搜索整个项目文件,或者从版本控制系统(如 Git)中还原该文件。
相关推荐
![json](https://img-home.csdnimg.cn/images/20210720083646.png)
![json](https://img-home.csdnimg.cn/images/20210720083646.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)