Question

我对TypeScript开发有点新意，但设法很快掌握了它。但是，我发现自己对设置一个包含所有这些模块加载器，编译器，设置以及其他设置的项目感到沮丧。

我试图在Visual Studio 2017中使用React为TypeScript设置工作环境，但无济于事。我尝试过以下方法：

MyTestComponent.tsx

/// <reference path="../typings/react/index.d.ts"/>

interface IProps {
    name: string
}

class MyTestComponent extends React.Component<IProps, {}> {
    render() {
        console.log("rendering component");
        return <span>{this.props.name}</span>;
    }
}

App.ts

/// <reference path="TsImports.ts"/>

class App {
    constructor() {
         console.log("app started");
         React.createElement(MyTestComponent,
            { name: "somename" },
            document.getElementById("someid"));
    }
}

的index.html

<div id="someid"></div>

<script src="~/Scripts/app.js"></script>
<script type="text/javascript">
   var app = new App();
</script>

我开始使用＆＃34;应用程序＆＃34;在控制台中，但没有渲染元素。我也没有收到任何控制台错误。

我还尝试过VS Code中的打字稿网站的官方教程，但它确实有用。但是，我无法弄清Webpack在整个过程中的作用。有人可以详细解释如何设置，或者至少指出一些资源。谢谢！

Answer 1

这是一个回购伙伴，我的朋友放在一起开始使用react和打字稿。这只是使用redux（使用webpack构建）在typescript中做出反应的超级基本工作实现。

https://github.com/drewschrauf/typescript-react-redux

如何在Visual Studio中使用React设置TypeScript

1 个答案: