ReactとReactDOMは、react.min.jsとreact-dom.min.jsより大きいbrowserifyでバンドルされます。

Question

私はreact getting started tutorialに従っています。 次に、外部パッケージをインポートする方法を理解しようとしたので、npm、browserify、watchifyなどを使い始めました。 同じチュートリアルにはsection dedicated to package managersがあります。最初の質問は

<title>Hello React!</title> 
<script src="build/react.js"></script> 
<script src="build/react-dom.js"></script> 

に従うようチュートリアルでのみbrowserifyから出てくるbundle.js含めるのではなく、彼らは

var React = require('react'); 
var ReactDOM = require('react-dom'); 

を書きますが、後に、彼らはまだRAWファイルを含めるのはなぜ」とは？ ないことを私には明確な。私は一種のこれを無視し

。だから私のHTMLはONLYバンドル全体を含めている

<script src="bundle.js"></script> 

私が行くとbundle.jsを見て、私は理解していないものがある大きさならば、これらはある私のindex.jsファイルの中にこのよう

browserify -t [ babelify --presets [ react ] ] index.js | uglifyjs > bundle.js 

で生成され

は

var React = require('react'); 
var ReactDOM = require('react-dom'); 
var $ = require('jquery'); 

が必要です。合計サイズは520KBです。ちょっとした例のためにあまりにも多くの！ require（ "jquery"）を削除した場合、合計サイズは388 KBに減少します。したがって、jqueryの重さは132 KBですが、jquery.min.jsをダウンロードするとサイズはわずか84 KBになります。 私がrequire（ "react-dom"）を削除した場合、合計サイズは70KBに減少しました。これは、React DOMが318KBの重さを意味しますが、react-dom.min.jsは1KBです！

ここでは何が起こっていますか？ 私はNODE_ENV var（honesltyについて、私はその値を変更する方法を理解できませんでした）を読んで、いくつかの解決法を試しましたが、ファイルサイズは同じままです。 しかし、それはポイントではありません。

react-dom.min.jsは1KB、react-dom.jsは2KBです！ それは生産/開発環境ではないようですか、何か不足していますか？

もう少し理解するのを手伝ってくれる誰にも感謝します。

Answer 1

この

browserify -t [ envify --NODE_ENV production babelify --presets [ react ] ] index.js | uglifyjs > bundle.js