Web開発のツール

ツールの分類が難しい。境界線がハッキリしないし、実際複数の役割を兼務しているソフトウェアが多そうだ。つまり、だいぶ機能重複があるってこと。

  • バンドラー: 複数のファイルをまとめて単一または少数のファイルにする。
  • 互換性トランスパイラ: JavaScriptのバージョンの違いを吸収するためのトランスパイラ。新しい構文を古い構文に変換する。
  • 言語トランスパイラ: TypeScriptのようなヤツ。
  • ビルドツール: Makeのようなモノ
  • タスクランナー: ある種のスクリプト言語とその実行系

現状は、もともとバンドラーとして設計されたソフトウェアがビルドツール的な機能を備えて、その一部にトランスパイラも含まれる、ということかな。ともかくゴチャゴチャしている。

実際のツールだと:

  • Webpack, rollup, vite バンドラー、ビルドツール
  • Babel 互換性トランスパイラ
  • Gulp タスクランナー、ビルドツール
  • esbuild ウーン?? トランスパイラ機能がウリのバンドラーかな? viteから使われている。

[追記]
Snowpackのサイトの冒頭に、

Check out Vite for a well-maintained Snowpack alternative.
See also: esbuild, parcel

Snowpackがviteを推奨しているってこと? esbuild は vite の一部だし、vite は rollup も使っている。

parcel は The zero configuration build tool for the web と謳っている。ゼロコンフィグがウリなのかな。

Rome のサイトでは:

Rome is a formatter, linter, bundler, and more for JavaScript, TypeScript, JSON, HTML, Markdown, and CSS.

Rome is designed to replace Babel, ESLint, webpack, Prettier, Jest, and others.

ますますワケワカラン。
[/追記]

[さらに追記]
機能充実だが重い順に並べると:

  • Webpack > rollup > vite

かな。ただし、vite はプロダクションビルドに rollup を使っている。

  • vite > esbuild

とも言えるが、vite は esbuild を使っている。snowpack も esbuild を使っている。

swcはBabelと同種のトランスパイラかな。esbuildの競合になるが、esbuildのほうが機能性豊かかも知れない。

Rome は Babel, ESLint, webpack, Prettier, Jest, などすべてをフルセットで置き換えるらしい。すべての道はローマに通ず〈All roads lead to Rome〉、か。
[/さらに追記]