ブログ

Webpackのススメ

JavascriptというWeb制作で使われる言語があります。

色々なサイトのHTMLソースコードをのぞいて見るとわかりますが、

<script src=”//example.com/example.min.js”></script>

などという形で読み込まれているのがJavascriptのファイルです。

ひとつのファイルにまとめあげてくれる方法

方法のひとつとして最近よく使われているのがWebpackと呼ばれるツールです。

これを使うと複数あるJavascriptファイルをひとつのファイルにまとめあげることが可能です。Babelというコンパイラを使うように設定すればES6と呼ばれるような最新のJavascriptのコードも記述することが可能です。(ES6では一般的なオブジェクト指向言語にあるようなclassが使えます。)Babelというのは具体的にどういったものなのかというと、ES6などと呼ばれるこれからJavascriptに搭載される最新の仕様を、現在使われているJavascriptのコードに変換してくれるものなんです。コンパイラと聞くとその都度コンパイルを実行するのが面倒くさいなと思われるかもしれませんがこういった処理というのは自動化することが可能です。セーブした瞬間にコンパイラが走ってということをさせることができるんです。さらに他のツールを組み合わせれば、セーブしてコンパイルしたタイミングでブラウザの画面をリロードするというようなこともできるんです。わざわざ自分でリロードをしなくてもすむんですね。

こういったものとWebpackなどのツールを組み合わせて快適な環境を作り上げていくというのが現在のトレンドです。

Webpackでひとつのファイルにするときにminifyといって圧縮も同時にかけることも可能です。これをするとファイル容量が減るのでアクセスしてくるユーザーにも優しいですし、サーバーにもやさしいですよね。また、minifyするときにライセンスコメントだけを残す設定をすることもできます。ライセンスコメントを消してしまうのはライセンス違反になってしまいますからね。こういうのは気をつけなければなりません。

Webpackなど便利なツールは沢山でているのでぜひ一度試してみていただきたいですね。手放せなくなりますよ。

関連記事

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

プロフィール

プロフィール

このサイトを運営しているUMIDASWEB遺志衣です。
WEB制作会社でWEB制作メインで知多半島を中心に活動しています。2020年に入り、動画制作の受注が増えたことから4K対応動画制作が増えています。

知多市・東海市・阿久比町・半田市・常滑市でYouTube活動をされている方からの依頼が増え、動画制作おすすめ制作会社になりつつあります。

フォロー

おすすめ商品

  1. ホームページ制作
  2. 知多半島飲食店ポータルサイト
  3. 動画制作
ページ上部へ戻る