如何将 Coffeescript 2 视为 JSX？ （网络包/通天塔）

Posted 2023-03-03

【中文标题】如何将 Coffeescript 2 视为 JSX？ （网络包/通天塔）

【英文标题】：How can Coffeescript 2 be treated as JSX? (Webpack/Babel)

【发布时间】：2018-03-28 06:15:24

【问题描述】：

Coffeescript 2 允许将 JSX/XML 直接包含到语言中。我怎样才能让 Babel（我认为这是 Babel 的工作）将 Coffeescript 编译为 javascript 并将生成的 JSX 编译为 Javascript？

我最好只使用.coffee 扩展名来执行此操作。

【问题讨论】：

如果您安装了正确的插件/预设，Babel 应该能够同时处理这两个问题。只需将它指向 .coffee 文件，它应该可以工作。

【参考方案1】：

Babel 不能直接使用 CoffeeScript；您首先需要使用 CoffeeScript 编译器将 .coffee 文件转换为 JSX。然后 Babel 可以将其转换为 JavaScript。

如果您还没有安装 Babel，请使用您想使用的任何插件，例如：

npm install --save-dev babel-core babel-preset-env babel-plugin-transform-react-jsx

创建.babelrc文件来配置Babel：

echo ' "presets": ["env"], "plugins": ["transform-react-jsx"] ' > .babelrc

那么最简单的选择是使用coffee 命令和--transpile，这将包括Babel 转译：

coffee --compile --transpile --inline-map some-file.coffee

生成的 some-file.js 将是可运行的 JavaScript。见http://coffeescript.org/#transpilation