Webpack Learning & Practices List

Resource | 资源

Book | 书籍

Tutorial | 教程

  • 2016-Getting Started with Webpack 2: At its simplest, webpack is a module bundler for your JavaScript. However, since its release it’s evolved into a manager of all your front-end code.

  • 2017-Intro To Webpack: Webpack is a very complex tool, and most people do not need to know how every part of it works.

  • 2017-Webpack: A Detailed Introduction: JavaScript module bundling has been around for a while. RequireJS had its first commits in 2009, then Browserify made its debut, and since then several other bundlers have spawned across the Internet. Among that group, webpack has jumped out as one of the best. If you’re not familiar with it, I hope this article will get you started with this powerful tool.

  • WEBPACK - THE GOOD PARTS: What is Webpack, Developing, Building, Assets, Bundle/code Splitting, Analysis, Optimizing.

  • 2018-Webpack Basics: Many people seem to like Webpack and use it for their everyday web bundling process.

Configuration: 基础配置

Modularity: 模块化

Build Performance: 构建性能优化

Production | 发布到生产环境

Code Split | 代码分割




  • preload-webpack-plugin: A Webpack plugin for wiring up link <rel='preload'> (and prefetch) - supports async chunks