初识Webpack5大核心模块(一)

webpack安装

npm i  -D webpack

Webpack是什么？

①Webpack是一种前端资源构建工具，一个静态模块打包器(module bundler)。
②在Webpack看来，前端的所有资源文件(js/json/css/img/less/…)都会作为模块进行处理。
③它会根据模块的依赖关系进行静态分析，打包生成对应的静态资源。

Webpack五大核心模块：

entry：

入口提示Webpack以哪个文件为入口起点开始打包，分析构建内部依赖图。

output：

输出提示webpack打包后的资源输出到哪里去，以及如何命名。

(loader)module：

让Webpack能够去处理那些非js文件（webpack自身只能理解js/json,不能处理css/img等其他资源）

plugins：

插件可以用于执行范围更广的任务。插件的范围包括，从打包优化到压缩，一直到重新定义环境中的变量等。

mode：

开发模式：能让代码本地调试的环境会将process.env.NODE_ENV = development.

生产模式：能让代码优化上线运行的环境。process.env.NODE_ENV = production.