从@ types / history使用createBrowserHistory()时出现Tslint错误

时间:2019-02-03 03:13:44

标签: typescript tslint

我正在我的React应用程序中导入@types/history并使用其提供的createBrowserHistory()功能。

我得到一个tslint错误说,

ERROR in C:/Users/eshan/my-website/src/App.tsx
ERROR in C:/Users/eshan/my-website/src/App.tsx(13,11):
typedef: expected variable-declaration: 'history' to have a typedef

我确实环顾了一下,但是减轻这种情况的所有尝试似乎都旨在通过执行/* tslint:disable */来删除tslint规则。我想添加类型支持,并修复它。

import * as React from 'react';
import { Router, Route, Switch } from 'react-router-dom';
import { createBrowserHistory } from 'history';
import './App.css';

class App extends React.Component {
  public render(): JSX.Element {
  const history = createBrowserHistory();

  return (
    <div className='App'>
      <Router history={history}>
        <Switch>
          <Route exact path='/' component={Landing}/>
          <Route exact path='/Home' component={Home}/>
        </Switch>
      </Router>
    </div>
    );
  }
}

export default App;

1 个答案:

答案 0 :(得分:1)

您的问题根本与@types/history库无关。就是在您的typedef设置中配置了tslint.json规则,要求在包含history变量的地方进行类型定义。

此代码也可能会出现TSLint投诉:

const createMyHistory = () => ({
    someMember: "someValue",
});

const history = createMyHistory();

..因为history没有明确的类型定义。

有两种方法可以在没有// tslint:disable-next-line的情况下解决错误:

编辑:仅为了增加下面注释中的可见性,此处有两种名为History的类型/接口。一种是DOM类型附带的全局定义的。另一个是在@types/history中定义的。不幸的是,他们两个名字相同。如果您发现与History<any>不兼容History的错误,请从Historyimport添加到history中:

import { createBrowserHistory, History } from 'history';

这将使您的代码引用@types/history的版本。