"Webpack" Help document translation: Webpack module

Page from Webpack Official document (when composing, is v4.1.1)

In fact, Webpack itself has Chinese documents, do not know who to write, but their own translation once feel better understanding.

https://webpack.js.org/concepts/modules/

Module

In modular programming, developers split the code of individual functions into modules.

Each module volume is smaller than a large lump of the program, making debugging and writing easier.

NODEJS has supported modular programming since its inception, but in Web programming, modularity has been slow (not supported), and of course there are many JS modular tools for modularity that have advantages and disadvantages.

Webpack refine, inheriting their excellent place, makes modularity suitable for any file in a Web project.

What is the Webpack module

Unlike the Nodejs single, Webpack can be used in a variety of ways to accomplish modular programming:

• Import expression of ES6
• require () Expression of COMMONJS
• Define and require representations of AMD (asynchronous module definition)
• @import Expressions in css/sass/less files
• Image URL address in a style sheet or HTML file (unknown?) ）

The Webpack 1 generation needs a specific loader to complete the import representation of ES6, but Webpack 2 is natively supported.

Supported Module types

Webpack supports loading various types of modules with the loader, which tells Webpack what these modules are (because it is not a JavaScript module) and then packs them together.

Types of support include:

• Coffeescript
• TypeScript
• Esnext (Babel)
• Sass
• Less
• Stylus

Wait a minute. Webpack supports many kinds of modular packaging for Web programming, making web development easier for developers.

The full list of loaders is as follows: Point me

"Webpack" Help document translation: Webpack module