reactjs - 最简单的 Typescript + React + WebPack 示例生成错误

标签 reactjs typescript webpack

当我编译一个简单的 React/Typescript 应用程序(如下所示)时,我收到了各种编译器警告,这些警告似乎不是来 self 的代码。

/// <reference path="main/ambient/react-dom/index.d.ts" />
/// <reference path="main/ambient/react/index.d.ts" />

import * as React from "react";
import { render } from "react-dom";

class Example extends React.Component<any, any> {
  render() {
    return <p> Hello! </p>;
  }
}

render(<Example />, document.getElementById("root"));

尽管此示例确实在编译后运行(通过 WebPack),但它会生成以下错误:

(19,22): error TS2339: Property 'createElement' does not exist on type '{}'.
(22,9): error TS2339: Property 'Component' does not exist on type '{}'.
(23,13): error TS2339: Property 'render' does not exist on type '{}'.
(23,26): error TS2339: Property 'createElement' does not exist on type '{}'.

我正在运行 React v0.14.8。我正在使用这些 typings for React还有这些typings for React-dom . enter link description here

我的问题是:为什么这个例子会产生这么多错误?我该如何解决这些错误?

请求:tsconfig.json

{
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "jsx": "react"
  },

  "exclude": [
    "node_modules",
    "typings/browser",
    "typings/browser.d.ts"
  ],
  "compileOnSave": false,
  "buildOnSave": false
}

最佳答案

我找到了解决方案。这些错误是由 WebPack 中的一个插件引起的 (new webpack.optimize.OccurenceOrderPlugin())。删除这个插件解决了这个问题。

关于reactjs - 最简单的 Typescript + React + WebPack 示例生成错误,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36356260/

相关文章:

reactjs - 带有 CommonsChunkPlugin 的 Serviceworker Chunk 不起作用,未定义 webpackJsonp

Javascript 正则表达式负向后视替代方案

reactjs - 为 "react-datepicker"的 mm/dd/yyyy 格式的日期插入自动斜杠

reactjs - 为什么 React 组件在状态没有改变时只重新渲染一次?

reactjs - 将图表 js 选项与 react-chartjs-2 和 typescript 一起使用

javascript - 如何使用查询选择器获取标签内的元素?

angular - 服务构造函数上的 DI 错误

typescript - 如何配置 Typescript、Karma、Webpack 以在浏览器中运行测试

reactjs - 在 React 中隐藏和显示外部组件

javascript - 为什么在 react 中将数据存储在状态中