webpack module packaging tools

webpack module packaging tools

From the above webpack look much like JS translator, in fact, this definition is not accurate, webpack only know the syntax import, many senior JS code did not know.
WebPACK module is actually a packaging tool, below the Header, Sidebar, Content is one of the modules, these modules WebPACK tool packaged together, to generate a final JS file.
Here Insert Picture Description
Note that: When we use the import or introduce some kind of code, when in fact we have such a code is called a module, so the content behind the introduction of import referred to as modules. webpack pack these modules to go.
In writing JS code, not only ES Moudule module specifications, as well as CommonJS, which is among the most commonly used node module introduced norms. There CMD, AMD these specifications. For these specifications, webpack can be identified.
ES Moudule module incorporated example embodiment introduced into the CommonJS mode:
CommonJS require use form is introduced into the
Here Insert Picture Description
respective module deriving its grammatical variations have occurred, now can not export default, but with module.exports
Here Insert Picture Description
WebPACK is a packaged module tool that can identify any syntax introduced module, the generated code can be executed.
The first time webpack is a JS module packaging tools can only import, require about this js file and then packaged into index.js file, with the development of webpack, it is not just packaged module JS files, it It can be packaged in any other form of module files, such as css files, jpg, png so that the picture file, you can pack anything you want to package. So webpack module is a packaged tool.

Learn webpack official website document:

DOCUMENTATION ----> CONCEPTS (concept) ----> Modules
Details of the ES Moudule, CommonJS, AMD and so the concept of modularity
Here Insert Picture Description
DOCUMENTATION ----> API ----> Modules
describes some of the methods Module and variable, in the form of these two api, more complete lists all of the modular introduction of grammar, syntax exported, including some commonly used variables inside.
The official website can learn a deeper understanding webpack.

Published 137 original articles · won praise 30 · views 260 000 +

Guess you like

Origin blog.csdn.net/hani_wen/article/details/92984225