fuseboxを使用して、ReactのWebpackに代わるバンドルの代替

ウェブパックの代替品を探していますか？ Fuseboxを検討してください。コード分​​割、ホットモジュールのリロード、動的インポートなどの同等の機能を提供しますが、重要な利点があります。コード分割はデフォルトではゼロコンフィグレーションです（バージョン4.0でのみ獲得した機能Webパック）。

Fuseboxは、単純さ（合理化された構成を介して）とパフォーマンス（積極的なキャッシングを介して）を優先します。プラグインを介したその拡張性により、デフォルトを超えて高度なニーズを処理できます。そして、TypeScriptユーザーの場合、それは一流の市民です。つまり、TypeScriptプロジェクトには追加の構成が必要ありません。 JavaScriptプロジェクトも同様にサポートされています。

基本的なReactアプリを構築して、使いやすさを実証しましょう。完全なコードはGitHubで利用できます。

Fuseboxは唯一のWebパックの代替品ではありません。 Maks Akymenkoの小包に関する優れた記事は、別​​の強力な候補を強調しています。

基本セットアップ

1. 新しいプロジェクトディレクトリを作成し、NPMで初期化します。

 mkdir csstricks-fusebox-react && cd $ _
npm init -y

2. React and React Domをインストールします：

 npmインストール -  save react react-dom

3. Fusebox、TypeScript、UglifyJS、およびノー​​ドSASSをインストールします。

 npmインストール -  save-dev fuse-box typecript uglify-js node-sass

4. srcフォルダーを作成し、 app.jsとindex.jsを追加します。

 // app.js
「React」からの反応として *インポート。
"./logo.svg"からのロゴとしてインポート *。

const app =（）=>（
  <div classname="App">
    <img src="/static/imghwm/default1.png" data-src="https://img.php.cn/?x-oss-process=image/resize,p_40" class="lazy" alt="fuseboxを使用して、ReactのWebpackに代わるバンドルの代替">
  </div>

以上がfuseboxを使用して、ReactのWebpackに代わるバンドルの代替の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。