Question

我有两个文件

app.tsx：

// Remember to rename the file from app.ts to app.tsx
// and to keep it in the src/ directory.

import * as React from "react";
import * as ReactDOM from "react-dom";
import Hello from "./Hello";

ReactDOM.render(
  <Hello name="Willson" />,
  document.getElementById("root")
);

Hello.tsx

import * as React from "react";

interface HelloProps {
  name: string;
}

class Hello extends React.Component<HelloProps, {}> {
  render() {
    return <div>Hello  {this.props.name}</div>;
  }
}

export default Hello;

这两个文件都位于同一个文件夹中。

我已将tsconfig.js写成

{
    "compilerOptions": {
        "module": "commonjs",
        "target": "es5",
        "outDir": "./built/",
        "jsx": "react",
        "lib": [
            "dom",
            "es2017"
        ],
        "sourceMap": true,
        "noImplicitAny": false
    },
    "files": [
        "src/app.tsx"
    ]
}

尝试在节点js中运行tsc时，将错误视为

src/Hello.tsx(9,30): error TS2339: Property 'props' does not exist on type 'Hello'.

我的目标是通过webpack捆绑从app.tsx和hello.jsx编译的js文件。

请帮助我，因为我是初学者。提前致谢

我无法将tsx编译成js文件。我该怎么做？

0 个答案: