webpackは、オープンソースのJavaScriptモジュールバンドラーである。主にJavaScript用に作成されているが、対応するローダーを追加することでHTML、CSS、画像などのフロントエンドアセットを変換できる。webpackは依存関係のあるモジュールを受け取り、それらのモジュールを表す静的アセットを生成する。

Webpackは依存関係を取得し、依存関係グラフを生成して、Web開発者がWebアプリケーション開発の目的でモジュラーアプローチを使用できるようにする。コマンドラインから使用し、webpack.config.jsという名前の構成ファイルを使用して構成を行うことができる。このファイルは、プロジェクトのルール、プラグインなどを定義するために使用される(webpackは、開発者がファイルをバンドルするときに実行したいカスタムタスクを記述できるようにするルールを介して、高度に拡張可能である)。

webpackを使用するには、Node.jsが必要である。

webpackは、モニカ code splitting を使用してCode on demandを提供する。The Technical Committee 39 for ECMAScriptは、追加のコード「proposal-dynamic-import」をロードする関数の標準化に取り組んでいる。

webpack開発サーバー

webpackは、開発中にファイルを提供するためのHTTPサーバとして使用できる webpack dev server と呼ばれる組み込みの開発サーバも提供する。また、Hot Module Replacement を使用する機能も提供する。

関連項目

  • Browserify
  • Grunt
  • Gulp.js

参考文献

外部リンク

  • 公式ウェブサイト

Getting started with webpack Part 1 Introduction

A Comprehensive Overview of webpack KeyCDN

Webpack 2 The Basics

25+ Free Webpack Courses for beginners [2025 JAN]

What’s new in webpack 5? w3iscool