What is Webpack

Webpack can be thought of as a module baler: What it does is analyze the structure of your project, find JavaScript modules and other extension languages that browsers don’t run directly, and package them into the appropriate format for browsers to use.

Two, environment configuration

Node NPM installation

MAC www.jianshu.com/p/9dae932f3…

Windows www.jianshu.com/p/03a76b2e7…

Share goals

Chapter 1 Basic Configuration of WebPack (source code attached)

  •       1.1 Basic WebPack Configuration

  •      1.2 WebPack Basic Custom configuration
  •       1.3 Webpack configures CSS and other style sheets to extract output
  •       1.4 ES6 or higher JavaScript syntax configuration for Webpack

  •       1.5 jQuery configuration for Webpack 

  •       1.6 Image resource configuration for Webpack

Chapter 2 Common Configuration of WebPack (source code attached)

  •       2.1 Module splitting and packaging configuration of Webpack
  •       2.2 Webpack configuration of Devtool, Watch, and Resolve properties
  •      2.3 Webpackage 4.0+ development and production environment & configuration of environment variables
  •       2.4 WebPack cross-domain problem configuration

Chapter three webpack optimization

  •       3.1 Application of IgnorePlugin, dllPlugin and other plug-ins under Webpack and implementation of lazy loading and hot update

So far the basic introduction of WebPack is not good, there is time to update its implementation principle….