使用 Babel-cli 手动转换 React JSX

编程问答 2022-08-08

问题描述

如何使用 .jsx 命令编译 npx babel-cli [inpfile].jsx --out-file [outfile].js --plugin=@[someplugin] 文件。我试过 --plugin=@plugin-transform-react-jsx 但它在第一个 JSX 表达式上出错。

我已经安装了 babel-cli、babel-core 等软件包。

我可以使用 create-react-app 并且一切正常，但我想手动执行此操作，编译 JSX。

此外，如果使用相同的程序可以实现 ES6 到 ES5 的转换；也请说明。

任何帮助将不胜感激。

解决方法

您只需安装最新的 babel 包（看起来您正在尝试安装旧的）。以下是几个步骤：

  • 安装所需的软件包：
npm i -D @babel/core @babel/cli @babel/preset-env @babel/preset-react
  • 运行您的测试 jsx 文件：
npx babel path/to/yourFile.jsx --presets=@babel/preset-env,@babel/preset-react
babel-clibabel-corebabeljsjsxjsxjsxreactjsreactjsreactjsreactjs