无法在Typescript React项目中导入JSON

时间:2019-12-23 11:27:52

标签: reactjs typescript

我正在尝试在我的react-typescript项目中使用JSON,但出现以下错误

  

找不到模块'./constants/ui/super-tokens-benefits.json'。   考虑使用'--resolveJsonModule'导入带有'.json'的模块   扩展

这是我的tsconfig.json文件

{
  "compilerOptions": {
    "target": "es6",
    "lib": [
      "dom",
      "dom.iterable",
      "esnext"
    ],
    "allowJs": true,
    "skipLibCheck": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "strict": true,
    "forceConsistentCasingInFileNames": true,
    "module": "esnext",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "noEmit": true,
    "jsx": "react"
  },
  "include": [
    "src"
  ]
}

这就是我的使用方式(home.tsx)

import React from 'react';
import {IconRowContainer} from './components/layout';
import  SuperTokenBenefits from './constants/ui/super-tokens-benefits.json';
import "./styles/home.scss"


const home: React.FC = () => {
  return (
    <div className="home">
    {SuperTokenBenefits.map(el => {
      return (
        <IconRowContainer
          heading={el.heading}
          para={el.para}
        />
      )
    })}
    </div>
  );
}

export default home;

我的文件夹结构如下所示

有人可以帮助我解决这个错误吗?

enter image description here

0 个答案:

没有答案