React/Typescript Ag-grid

Posted

技术标签:

【中文标题】React/Typescript Ag-grid【英文标题】: 【发布时间】:2017-01-22 06:20:04 【问题描述】:

我正在尝试在我的应用程序中使用带有 react 和 typescript 的 ag-grid。 ag-grid .d.ts 文件在项目中,所以我无法安装,然后使用 typings install --save...

问题是当我尝试导入它时......

import  AgGridReact  from 'ag-grid-react';

我正在使用 VSCode...它显示“[ts] 找不到模块”,同时编译相同的东西。

有关应用程序的更多信息: tsconfig.json


    "compileOnSave": false,
    "compilerOptions": 
        "noImplicitAny": false,
        "noEmitOnError": false,
        "removeComments": false,
        "sourceMap": false,
        "target": "es5",
        "module": "system",
        "jsx": "react"
    

typings.json


  "name": "focco-sys-jspm",
  "dependencies": 
    "react": "registry:npm/react#15.0.1+20160601175240",
    "react-addons-update": "registry:npm/react-addons-update#0.14.0+20160324044346",
    "react-dom": "registry:npm/react-dom#15.0.1+20160705210405",
    "react-router": "registry:npm/react-router#2.4.0+20160811060709"
  

最后我尝试在我的打字文件中包含参考 index.d.ts

/// <reference path="modules/react-addons-update/index.d.ts" />
/// <reference path="modules/react-dom/index.d.ts" />
/// <reference path="modules/react-router/index.d.ts" />
/// <reference path="modules/react/index.d.ts" />
/// <reference path="../jspm_packages/npm/ag-grid@5.4.0/main.d.ts" />
/// <reference path="../jspm_packages/npm/ag-grid-react@5.4.0/main.d.ts" />

【问题讨论】:

How to export a TypeScript module for SystemJS?的可能重复 我使用的是 ag-grid 和 ag-grid-react,没有自定义配置,没有打字。这是由于现在在 2.4 以上版本中修复的旧版本 TS 造成的吗? 【参考方案1】:

将您的 typings.json 更改为


  "name": "focco-sys-jspm",
  "dependencies": 
    "react": "registry:npm/react#15.0.1+20160601175240",
    "react-addons-update": "registry:npm/react-addons-update#0.14.0+20160324044346",
    "react-dom": "registry:npm/react-dom#15.0.1+20160705210405",
    "react-router": "registry:npm/react-router#2.4.0+20160811060709",
    "ag-grid": "13.1.x",
    "ag-grid-react": "13.1.x"
  

一旦您包含这两个依赖项,请转到您的根包文件夹并从那里打开命令提示符。在命令提示符中输入npm install。它应该安装 ag-grid 依赖项。

【讨论】:

以上是关于React/Typescript Ag-grid的主要内容,如果未能解决你的问题,请参考以下文章

使用react搭建组件库:react+typescript

在 React/Typescript 中输入对象

无法在 redux 、 react/typescript 中使用 rootReducer

带有 React、TypeScript 和 Webpack 的空白页面

使用 React/Typescript 的 React-query 数据的 SetState

TypeScript && React