时间戳

首页 > 解决方案 > 我无法在运行时更改本地 json 文件

vue.js - 我无法在运行时更改本地 json 文件

问题描述

我想在我的应用程序中使用本地 json 文件。我只是将它导入并使用，在开发中没有任何问题。但是在构建之后，它被捆绑在一起，我无法看到或更改它。

我不希望它被捆绑，所以我可以在我的应用程序在我的主机上运行时更改它。

或任何其他建议表示赞赏。

<script>
import articlesJson from "./../static/articles.json";

export default {
  name: "Body",
  data() {
    return {
      articles: articlesJson
    };
  },
};
</script>

构建后我的 dist 文件夹。

.
├── css
│   ├── app.934f0703.css
│   └── chunk-vendors.e246dba9.css
├── fav.ico
├── img
│   └── profile-photo.446da51d.jpg
├── index.html
└── js
    ├── app.01988997.js
    ├── app.01988997.js.map
    ├── chunk-vendors.3ee1fa24.js
    └── chunk-vendors.3ee1fa24.js.map

标签： vue.js

解决方案

如果将 json 文件转换为 .js 文件并声明和导出 json 对象，您应该能够导入 json 文件中的数据。

const myObject = { 'property': 'value' }
export default myObject;

然后你应该能够像使用任何其他模块一样使用它。或者，您可能需要某种 json 加载器... webpack docs

编辑 我刚刚看到您的问题不是导入文件而是更新它。如果您希望您的应用程序看到最新版本，您需要直接引用该文件，而不是从包中导入模块。如果不重新打包/部署，捆绑包将不会更新。

我不确定您如何为您的应用程序提供服务，但除了直接引用您的 json 文件之外，您还需要确保将该文件部署到服务器，而不是简单地与其他未捆绑的 js 闲逛t 被部署。

推荐阅读