書籍詳細(速習 webpack 第2版)

速習 webpack 第2版 書影

速習 webpack 第2版

著者山田祥寛
出版社WINGSプロジェクト
価格500円(税込)
判型Kindle版・4色
ページ数145ページ
発売日2020年9月17日
シリーズ 速習(QUICK MASTER - WINGS)
対象レベル初級

サクッと学べる。webpackの解説書。

フロントエンド(JavaScript)開発には欠かせないwebpackを学ぶ電子書籍です。
webpackの使い方を5個のPartに分けて、サンプルコードとともに詳しく解説しています。隙間時間などを利用してサクッとwebpackをマスターしましょう。

※本書は、旧版「速習 webpack」を執筆時点(2020年9月)の最新情報で改訂したものです。
速習 webpack 第2版 ロゴ

更新履歴

更新情報はありません。

目次

  • はじめに
  • 対象読者
  • サンプルプログラムについて
  • Part 1:イントロダクション
  • 1.1 従来型のJavaScriptライブラリ
  • 1.2 モジュールバンドラーの登場
  • 1.3 webpackの利点
  • Part 2:モジュールバンドラーの基本
  • 2.1 モジュールの基本
  • 2.1.1 モジュールを定義する
  • 2.1.2 モジュールのインポート
  • 2.1.3 import命令のさまざまな記法
  • 2.2 webpackを利用するための準備
  • 2.3 webpackの基本
  • Part 3:設定ファイルの基本
  • 3.1 設定ファイルの骨組み
  • 3.1.1 ショートカットコマンドを準備する
  • 3.2 開発サーバーの導入
  • 3.2.1 補足:開発サーバーの設定
  • 3.2.2 watchモードによるファイルの監視
  • 3.3 本番/開発モードの選択
  • 3.3.1 コードの圧縮
  • 3.3.2 ソースマップの生成
  • 3.3.3 補足:開発/本番コードの区別
  • Part 4:ローダー
  • 4.1 スタイルシートのバンドル - css-loader/style-loader
  • 4.1.1 css-loader/style-loaderの有効化
  • 4.1.2 スタイルシートの準備とインポート
  • 4.1.3 スタイルシートを<link>要素で出力する - ExtractTextPlugin
  • 4.2 画像ファイルをバンドルする - url-loader
  • 4.2.1 url-loaderの有効化
  • 4.2.2 一定以上の画像データはファイルとして出力 - file-loader
  • 4.2.3 url関数による画像のインポート
  • 4.2.4 補足:url関数の書き替え
  • 4.3 フォントファイルをバンドルする - file-loader
  • 4.3.1 フォントの準備
  • 4.3.2 スタイルシートの準備
  • 4.3.3 file-loaderの有効化
  • 4.4 JSON、HTML/XML、CSV/TSVなどのデータをインポートする
  • 4.4.1 JSONデータの取得
  • 4.4.2 CSV/TSVデータの取得 - csv-loader
  • 4.4.3 HTMLデータの取得 - html-loader
  • 4.4.4 XMLデータの取得
  • 4.5 最新のECMAScriptを利用する - babel-loader
  • 4.5.1 babel-loaderの有効化
  • 4.5.2 Babelの設定ファイルを準備する - .babelrc
  • 4.5.3 補足:Babel+React環境を構築する
  • 4.6 TypeScriptのコードをコンパイルする - ts-loader
  • 4.6.1 ts-loaderの有効化
  • 4.6.2 TypeScriptの設定情報
  • 4.7 Sassのコードをコンパイルする - sass-loader
  • 4.7.1 sass-loaderの有効化
  • 4.8 JavaScriptの「べからず」なコードを洗い出す - eslint-loader
  • 4.8.1 eslint-loaderの有効化
  • 4.8.2 ESLintのルールをカスタマイズする
  • 4.8.3 ESLintとBabelとの連携
  • Part 5:プラグイン
  • 5.1 複数のエントリーポイントを処理する
  • 5.1.1 共通のライブラリを分離する
  • 5.2 トップページを自動生成する - html-webpack-plugin
  • 5.2.1 html-webpack-pluginの有効化
  • 5.2.2 補足:テンプレートで参照可能な変数
  • 5.3 出力先フォルダーのクリーンアップ - clean-webpack-plugin
  • 5.4 バンドル時にコードを圧縮する - terser-webpack-plugin
  • 5.4.1 terser-webpack-pluginの設定
  • 5.4.2 補足:その他の圧縮オプション
  • 5.5 スタイルシートを圧縮する - optimize-css-assets-webpack-plugin
  • 5.6 画像ファイルを圧縮する - ImageminPlugin
  • 5.6.1 ImageminPluginのインストール
  • 5.6.2 ImageminPluginの設定
  • 5.7 ビルドファイルにコメントを追加する - BannerPlugin
  • 5.8設定ファイルを分離する - webpack-merge
  • 5.8.1 modeオプションによる切り替え
  • 5.8.2 補足:--envオプション

正誤表

現在、正誤情報はありません。

FAQ

現在、FAQはありません。

お問い合わせ

書籍に関するご質問や誤りのご報告、ご意見・ご感想などをお寄せください。

Powered by メールフォーム 『オレンジフォーム』