Webpack & 理解 input & output 概念

一、介绍

如果还没用过 Webpack 请先阅读 Webpack & 基础入门 再回头看本文。

Webpack 的核心只做两件事,输入管理(Input Management)和输出管理(Output Management),什么花里胡哨的插件和配置都离不开这俩概念,带着俩概念去看文档我相信你会有所收获,而不再被密密麻麻的配置搞得云里雾里。

二、Input

  • modules.rules 对接受过来的文件交给 loader 处理。
  • resolve.extensions / resolve.alias 对接受过来的文件进行后缀识别、别名识别。
  • ...

这些配置都是针对"输入"来作为切入点,它们有个抽象名词叫 Input Management 即输入管理。

三、Output

  • entry 定义 Webpack 编译入口。
  • output 将输出的产物放到指定地方。
  • optimization 将输出的产物文件进行切分、缓存。
  • plugins 将输出的产物源码进行细化的操作。
  • ...

这些配置都是针对"输出"来作为切入点,它们有个抽象名词叫Output Management 即输出管理。


完!

相关推荐
Yanni4Night7 小时前
JavaScript打包器大奖赛:谁是构建速度之王? 🚀
前端·javascript
默海笑7 小时前
VUE后台管理系统:项目架构之搭建Layout架构解决方案与实现
前端·javascript·vue.js
咸鱼加辣7 小时前
【前端脚手架】node
前端
温宇飞7 小时前
WebGL 的渲染管道和编程接口
前端·webgl
帅的被人砍xxx7 小时前
【vue演练场安装 element-plus框架】
前端
麦麦大数据7 小时前
F051-vue+flask企业债务舆情风险预测分析系统
前端·vue.js·人工智能·flask·知识图谱·企业信息·债务分析
1024肥宅7 小时前
现代 JavaScript 特性:ES6+ 新特性深度解析与实践
前端·javascript·面试
速易达网络7 小时前
基于Java Servlet的用户登录系统设计与实现
java·前端·mvc
晨光32118 小时前
Day34 模块与包的导入
java·前端·python
BD_Marathon8 小时前
Vue3_关于CSS样式的导入方式
前端·css