2016-03-27 21 views
0

簡単な質問ですが、生のファイルの内容を受け取るバベルプラグインを作成し、BabelからASTに解析される前に、コンパイルされた文字列をBabelに返しますか?Babel Plugin Pre-ASTのコンパイルは?

背景

私は、サーバー上で、ブラウザでJSにHTMLテンプレートをコンパイルする必要がリアクト多型のアプリケーションを作成しています。私は、平行ビューファイルを作成するためにReact Templatesを使用

は一緒にこのようなコンポーネントファイルを、反応:

components/layout/layout.component.js 
components/layout/layout.template.html 

私は、多くの場合、設計者はコンポーネントテンプレートへのアクセスを提供する必要があるので、これは私にとって有用です。私のcompnentファイル内:

import template from './layout.template.html'; 

class Layout extends React.Component { 
    // code 
    render(){ 
    return template.call(this); 
    } 
} 

これは私がwebpackでコンパイルするので、これはうまく動作します。既存のWebpackローダーがあり、HTMLコンテンツを受け取り、React Templatesを使用してJavascriptに変換します。ただし、webpackを使用すると、ファイルの内容に直接アクセスできるため、React Templatesモジュール(see loader)のコンパイルを行うことができます。

ReactDomServer.renderToStringを使用してサーバー上でレンダリングすると(ウェブパックがコンパイルされていない場合)、上記のimpport呼び出しでは、コンパイルされたテンプレートはインポートされません。

Webpackに似たBabelを使って、つまりASTに解析される前にファイルをコンパイルすることは可能ですか?

代わりに、サーバーを実行する前にテンプレートファイルをコンパイルし、コンパイルしたファイルをインポートするタスクを作成することもできます。この解決策は、多くの厄介者を残す。

答えて

1

babel-plugin-webpack-loadersこの場合、おそらく最も良い賭けです。

+0

非常に興味深い。私は反応テンプレートローダーを使ってそのショットを与え、それがうまくいけば答えを受け入れます。 –

+0

これはいくつかのプラグインに限られているようです。私はそれが一般的なケースのために働くことができるかどうかを知りたいのです。私が追求するために作成した問題は次のとおりです。https://github.com/istarkov/babel-plugin-webpack-loaders/issues/62 –

関連する問題