我最近的任务是将React + TypeScript与现有的入门应用程序集成，该应用程序包含许多优秀的Polymer Components（Predix UI Starter）。我理解这对某些人来说似乎不太敏感（毕竟，你可以简单地使用Polymer作为框架提供应用程序状态和逻辑）。但是，React 库和TypeScript的面向对象特性可以提供很多东西，那么有什么技巧可以在这里开始？
答案 0 :(得分：0)
我将Predix UI Starter与create-react-app starter进行整合。具体来说，我将启用React组件来渲染（）px-dropdown聚合物组件。该概念和方法可适用于任何聚合物起始器app。 不会完全整合这两个启动器，它是 ONLY 用于在React render（）方法中使用TypeScript渲染聚合物组件的POC。
克隆这两个回购。完成Predix UI Starter - 在您运行npm install和bower install后，它将包含所有组件。
确保Predix UI Starter中的package.json包含react应用程序包含的所有依赖项和 devDependencies 。在package.json文件的scripts对象中，将"start" : ...,更改为"start" : "react-scripts-ts start"。这将使用TypeScript将应用程序提供给localhost（这是tsconfig.json和tslint.json文件发挥作用的地方。
将tsconfig.json，tslint.json和tsconfig.test.json文件复制到Predix UI Starter的根目录中。
根据React应用的命名约定，将server文件夹重命名为src。在.bowerrc文件中，在public/之前附加bower_components，这将使public/index.html文件能够导入由凉亭生成的聚合物组件。除非配置为执行此操作，否则public/index.html将无法将父文件夹中的聚合物组件加载到public文件夹。 （用户可能需要将Predix Starter配置为最初提供public/index.html文件）。
从react starter到Predix starter，将App.tsx和index.tsx文件复制到src文件夹，并将index.html文件复制到{{1文件夹（此文件将是应用程序最初提供的文件）。
将public组件添加到JSX名称空间，以便通过将px-dropdown文件添加到根目录中以及以下内容，在反应组件中呈现它：
global.d.ts
您现在可以渲染（）declare namespace JSX {
interface IntrinsicElements {
'px-dropdown': any
}
}组件了。在px-dropdown文件中，使用以下两行（public/index.html标记内）导入组件：
<head>让我们将一些<link rel="import" href="bower_components/polymer/polymer.html" />
<link rel="import" href="bower_components/px-dropdown/px-dropdown.html" />
传递给items组件的props。在App文件中，编辑将组件呈现为index.tsx
<App items={'[{"key":"1", "val": "One"},{"key" : "2", "val": "Two"}]'}/>中的以下代码将成功呈现App.tsx组件：
px-dropdown您现在可以使用React + TypeScript开始渲染Polymer组件。