4

モジュールのネイティブCommonJSサポートがある環境で新しいプロジェクトを開始しています。これはアトムシェル プロジェクトであり、Browserify や webpack AFAIK などの事前コンパイル手順を使用する可能性はありません。require

app.jsxmy で宣言されているエントリポイント ファイルでJSX を使用できます。これは、以前に宣言されてindex.htmlいるためです。JSXTransformer

<script src="scripts/vendor/JSXTransformer.js"></script>
<script type="text/jsx" src="scripts/app.jsx"></script>

モジュール内で CommonJS モジュールとしてインポートされるサブモジュールに JSX 構文を使用できるようにしたいと考えていapp.jsxます。

// This raises an Error, the XML-like tags are not supported
var Grid = require('./scripts/grid.jsx');

私が理解している限りでは、JSX 構文を削除し、.NET 経由でロードされるすべてのモジュールのバニラ構文を使用することを余儀なくされますrequire。この状況でまだ JSX を使用する代替手段はありますか?

4

2 に答える 2

7

[アップデート]

JSX トランスフォーマーが非推奨になり、 Babel が推奨されるようになったため、 Babel のrequire フックを使用して、CommonJS のような環境で JSX をサポートできます。

使用法

require("babel/register");

.es6node が必要とする、拡張子、.es、.jsxおよびのすべての後続のファイルは.js、Babel によって変換されます。ポリフィルも自動的に必要になります。

注:デフォルトでは、requires tonode_modulesはすべて無視されます。次の方法で無視正規表現を渡すことで、これをオーバーライドできます。

require("babel/register")({
  // This will override `node_modules` ignoring - you can alternatively pass
  // an array of strings to be explicitly matched or a regex / glob
  ignore: false
});

[古い回答]

Node.js 環境 (atom-shell など) の場合は、node-jsxを使用できます。

require('node-jsx').install()
require("./myComponent.js");

.jsx必要に応じて拡張機能を使用することもできます。

require('node-jsx').install({extension: '.jsx'})
require("./myComponent.jsx");
于 2014-11-04T19:30:26.517 に答える
1

ソースディレクトリをコピーするだけです：

cp -R src dist

そして、react-toolsの jsx ツールを使用します

jsx -x jsx dist dist

そしてjsxファイルを削除します

find dist -iname '*.jsx' | xargs rm

これを行うためのよりクリーンな方法があるかもしれませんが、今のところはこれで十分です。

于 2014-11-04T19:03:39.470 に答える