没有 babelrc 的带有 TypeScript 和 JSX 的包裹？

【问题标题】：Parcel with TypeScript & TSX without babelrc?没有 babelrc 的带有 TypeScript 和 JSX 的包裹？
【发布时间】：2019-11-27 18:33:40
【问题描述】：

我刚刚开始了解 parceljs，发现它非常令人愉快，只有一件事似乎有点矫枉过正：

我正在使用 parceljs 将 infernojs 的 tsx 文件转换为 javascript。但是，生成的代码包含原始的 React.createElement 函数，这显然不能工作：

inferno_1.render(React.createElement("div", null, "woot"), document.getElementById("app"));

我已经看到使用带有插件 babel-plugin-inferno 的 .babelrc 文件的示例，这似乎可以工作，但是由于这增加了各种 babel 依赖项，我只是想知道没有办法指定转换函数，没有所有额外的行李。（因为包裹似乎是关于简单和所有）

【问题讨论】：

标签： typescript parceljs infernojs

【解决方案1】：

同样地，你只需要在你的 tsconfig 中设置 "jsxFactory":"h"，然后从你计划使用它的 'inferno-hyperscript' 导入它。

tsconfig:

{
  "compilerOptions": {
    "target": "es5",    
    "jsx":"react",
    "jsxFactory":"h",
    "lib":["dom","ESNext"],
    "module": "commonjs",    
    "strict": true,    
    "moduleResolution":"Node",
    "esModuleInterop": true,    
    "forceConsistentCasingInFileNames": true 
  },  
  "include":["src"]
}

在代码中使用：

import { h } from 'inferno-hyperscript';

function App() {
    return (
      <div className="App">
        Hello thar
      </div>
    );  
}

export default App;

您可能会以类似的方式使用 inferno-create-element，但我只尝试过 htags。

一个例子： https://github.com/jayy-lmao/inferno-parcel-ts

【讨论】：