Stackblitz，Angular包含JSON文件不工作

Question

我使用的是Stackblitz：https://stackblitz.com/edit/bible-talk

我使用的是Angular 10。

我正在尝试从JSON文件导入数据。

我在Stackblitz上找到了一个如何做到这一点的例子：

https://stackblitz.com/edit/json-import-example?file=src%2Fapp%2Fapp.component.html

您应该将这些添加到tsconfig.json的编译器选项中

"resolveJsonModule": true,
"esModuleInterop": true,
"allowSyntheticDefaultImports": true

我已经做到了：https://github.com/JaredMathis/bible-talk/commit/449f6269b85bb53eb5aa245bd709075db4307163

我仍然收到这个错误：

Error in src/app/app.component.ts (2:18)
Cannot find module '../assets/kjv/John.json' or its corresponding type declarations.

我做了一个全新的Stackblitz。它在那里是有效的。https://stackblitz.com/edit/json-import-not-working?file=tsconfig.json

Answer 1

我认为你在github版本中的导入是错误的，它以./开头，而你的工作stackblitz并非如此。

import data from './../assets/John.json';

尝试删除第一个./

Answer 2

Stackblitz目前不支持静态资产。请参阅：https://github.com/stackblitz/core/issues/72

解决方法:您必须在其他地方托管您的静态资产，并在代码中适当地链接它们。