这是我想通过 Typescript 运行的 React Router 设置。它可以在没有 Typescript 的情况下工作,但不能与 Typescript 一起工作。我在浏览器控制台中收到运行时错误。不过,转译效果很好。如果我单独包含“react.js”和“react-dom.js”,或者包含所有内容的巨大“bundle.js”,都没有什么区别。我做错了什么?
错误:
Router.js:91 Uncaught TypeError: Cannot read property 'Component' of undefined
// For context, the line says: React.Component
at Object../node_modules/react-router/es/Router.js (Router.js:91)
at __webpack_require__ (bootstrap:19)
at Object../node_modules/react-router-dom/es/Router.js (Router.js:2)
at __webpack_require__ (bootstrap:19)
at Object../node_modules/react-router-dom/es/BrowserRouter.js (BrowserRouter.js:11)
at __webpack_require__ (bootstrap:19)
at Object../node_modules/react-router-dom/es/index.js (index.js:1)
at __webpack_require__ (bootstrap:19)
at Object../src/index.tsx (index.tsx:3)
at __webpack_require__ (bootstrap:19)
代码:
import * as React from "react";
import * as ReactDOM from "react-dom";
import { BrowserRouter as Router, Route, Switch } from "react-router-dom";
class App extends React.Component {
render() {
return (
<Router>
<Switch>
<Route path="/test/" render={() => (
<div>
Test.
</div>
)} />
<Route exact={true} path="/" render={() => (
<div>
Root page.
</div>
)} />
</Switch>
</Router>
);
}
}
ReactDOM.render(
<App />,
document.getElementById("root") as HTMLElement
);
最佳答案
好的。
解决方案是将 "esModuleInterop": true
添加到我的 tsconfig.json
中。
此外,"allowSyntheticDefaultImports": true
允许我编写 import React from "react";
而不是 import * as React from "react";
.
谢谢大家。
关于javascript - “React” 未定义 React Router with Typescript,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55227775/