2017-06-28 15 views
6

作成反応するアプリは、次のようになりますApp.jsであなたを開始します。 App.cssはApp、その後リアクト部品のrender方法で文字列によって参照されているApp-headerのようなCSSクラスを持っています。この魔法のリンクはどうやって起こりますか?これはcss-loader npmパッケージの機能ですか?その場合、この機能はどこに文書化されていますか?私はWebpackの設定を調べるためにアプリを排出したが、このリンクがどのように起こっているかについて私の指を置くことはできなかった。CSS作成反応するアプリ

答えて

4

create-react-app READMEによれば、CSSインポートはWebPACKのプラグインによって処理されます。

このプロジェクトのセットアップは、すべての資産を処理するためのWebPACKを使用しています。 Webpackは、JavaScriptの枠を越えてインポートの概念を「拡張」する独自の方法を提供します。 JavaScriptファイルがCSSファイルに依存していることを表現するには、JavaScriptファイルからCSSをインポートする必要があります。これにより、Webpackよりもコードを他のビルドツールや環境に移植しにくくなります。

create-react-appを使用して作成されたプロジェクトのビルドシステムは、別のパッケージreact-scriptsにあります。 CSSの輸入を可能にするために使用プラグインであるように思わcss-loaderに、このプロジェクトincludes a dependency、のpackage.json

0

あなたがスタートをNPMときに、私の知る限り魔法の全てが反応し、スクリプトのインストールだモジュールおよび実行中に起こってする必要があり、作成反応するアプリを使用している場合。

関連する問題