Node.jsデザインパターン 第2版

258

8

章 ユニバーサル

JavaScript

多くのクライアント側のライブラリが

CommonJS

と

Webpack

をサポートしていて驚くことでしょう。

8.2.3

 

ES2015

を

Webpack

とともに使用

上で見たように、

Webpack

の主要な利点のひとつが、バンドル前にローダとプラグインを使ってソー

スコードを変換できることです。

この本 では

ES2015

が提 供する新しく便 利な機能を数 多く使ってきましたし、ユニバーサル

JavaScript

アプリケーションを作成する際にも使っていきたいと思っています。この節では、我々が作

成したソースモジュール内の

ES2015

構文を使用した例を書き直すのに、

Webpack

のローダ機能をどの

ように使うかを見ていきます。正しく設定すれば、

Webpack

はトランスパイル（トランスコンパイル）

を引き受け、生成するブラウザ用コードは

ES5

となるため、現在利用可能なすべてのブラウザとの最大

限の互換性が保証されます。

最初に、新し

くフォルダ

src

を作ってモジュールをそこに移しましょう。こうすれば、コードを整理

してトランスパイル後のコードをオリジナルのソースコードと分けておくことが容易になります。また

このように分けると、

Webpack

を正しく設定することが容易になり、コマンドラインから

Webpack

を

起動する方法も単純になります。

これでモジュールを書き直す準備ができました。

src/sayHello.js

の

ES2015

版は次のようになり

ます（

04_webpack_es ...