2016-03-30 11 views
3
私が何をしトリング午前何

のVisual Studio 2015 JSX/ES2015構文

を私はreact用のプリセットとbabel-core変圧器のためのreact-tools変圧器を入れ替えることができれば、私は見ていthisの回答に基づいて、 、es2015およびstage-1

C:\Program Files (x86)\Microsoft Visual Studio 14.0\Common7\IDE\Extensions\Microsoft\Web Tools\External\react-server

transformJsxFromPost機能の次の行は、形質転換のとリターンを実行します。

VS2015コミュニティはnodeJsserver.jsファイルは次の場所にあり、その場でコードをtranspileするノードサーバ上のツールを反応させ使用していますelementMapへのVisual Studioは:

var transformed = reactTools.transformWithDetails(code, { elementMap: true }); 
result = { elementMappings: transformed.elementMappings }; 

あなたはVSを起動し、これはあなたのローカルアプリのデータと開始に一時フォルダを作成し、 は、Visual Studio External\react-tools\フォルダがnode_modulesフォルダを持っているので、私はそこに、次のインストールNPM:

npm install babel-core --save-dev 
npm install babel-preset-es2015 --save-dev 
npm install babel-preset-react --save-dev 
npm install babel-preset-stage-1 --save-dev 
を私がこれまで持っている

%localappdata%\Temp\{most-recent-generated-guid-folder}

次の場所にあるノードサーバ

server.jsファイルの先頭に次を追加しました。

var babel = require('babel-core'); 
次の行のために、上記のtransformJsxFromPostで本の

、交換ライン:

var transformed = babel.transform(code, {sourceMaps: "inline"}); 
result = { elementMappings: transformed.map }; 

この段階では、視覚的なスタジオを再起動すると、それは私がreact-tools elementMapと同じ形式ではありません確かに(sourceMapが返さ取得、作品まだ)。

私はスタックしています: プリセットを使用するようにしようとすると、エラーが発生します。私は最初の行を変更するときに:

var transformed = babel.transform(code, {sourceMaps: "inline", presets: ['es2015', 'react', 'stage-1']}); 

私はエラーを取得する:

JSX Parser: Couldn't find preset \"es2015\" relative to directory \"C:\\Users\\

プリセットが反応し、サーバフォルダにpackage.jsonファイル内のすべての依存関係であり、それはすべての問題を持っていませんbabelで、なぜプラグインのtempディレクトリを探しているのですか?

答えて

2

この場合、実際のプリセットをインポートする代わりに、それらをインポートし、webpackのような文字列で名前を渡す必要がありました。

私は、次のインポートを追加しました:

var es2015 = require('babel-preset-es2015'); 
var react = require('babel-preset-react'); 
var stage1 = require('babel-preset-stage-1'); 

を、私は同様の質問に答えhereを追加した

presets: [es2015, react, stage1] 

presets: ['es2015', 'react', 'stage1'] 

を変更しました。

関連する問題