Question

在Windows 10上使用Cygwin（64位）在Node.js上安装了babel-cli，react和babel-preset-react，这是通过Windows Installer安装的（因为不支持Cygwin。）我使用{{1}安装了这些Node包。在全局模块文件夹中。

在yarn文档（https://django-compressor.readthedocs.io/en/latest/reactjs/）中，他们说预编译器设置可以解决问题：

django-compressor

然而，babel无法识别COMPRESS_PRECOMPILERS = ( ('text/jsx', 'cat {infile} | babel > {outfile}'), )（遇到虚拟dom元素时抛出错误。）很明显，因为我没有将jsx预设传递给命令。但是我无法使用该预设，因为我安装在全局模块文件夹中，现在我无法让babel查找并使用它。

我需要其中一种可能的解决方案：

如何让babel使用全局安装的预设（我应该如何以有效的方式使用react？）
如何在Django项目中使用babel --presets react文件？
如果我在本地安装预设（我似乎很不喜欢），我如何使用我的Django项目实现它而不会弄乱我的项目目录结构？

Answer 1

好的，我几次撞了我的头，找到了解决办法：

无法让babel使用全局安装的预设。必须在本地安装它们。必须在本地安装所有react，react-dom，babel-core，babel-loader，babel-preset-react（如果需要最新的ECMA语法，可能还需要babel-preset-es2015）。
没有地方可以将.babelrc文件放在预编译器将使用的位置。 babel中也没有package.json部分。相反，预编译器设置应该在命令行中传递预设，如：
```
COMPRESS_PRECOMPILERS = (
  ('text/jsx', 'cat {infile} | babel --presets react,es2015 > {outfile}'),
)
```
假设manage.py所在的文件夹也是Nodejs包的根目录。从wsgi文件部署和运行时未经过测试，但wsgi也可能位于manage.py旁边。

此外，它看起来像所有这些文件和文件夹： ~~node_modules~~ ，package.json和yarn.lock（如果我和yarn一起安装，）必须包含在版本控制中。

<强>编辑：我并不认为node_modules应该进入版本控制。

在django-compressor中为React预编译jsx

1 个答案: