gulp - 指定 gulp-inject 脚本类型

Question

我正在将 JSX 与 React 结合使用。是否可以指定注入(inject)脚本的类型，以便在开发模式下工作时使用浏览器内的 JSX 转换器？

<!-- inject:js -->
<script type="text/jsx" src="js/components/Component.js"></script>
<!-- endinject -->

Answer 1

gulp-inject 认为 JSX 是与 JavaScript 不同的类型。如果将文件后缀更改为 .jsx 并使用开始标记 inject:jsx 而不是 inject:js，则输出包含 type="text/jsx" 属性。

另一个选项(如果您需要保留 .js 后缀)是覆盖默认转换函数:

var inject = require('gulp-inject');

inject.transform.html.js = function (path) {
  return '<script type="text/jsx" src="'+path+'"></script>';
};