webpack-初见webpack

1.Webpack是什么?

webpack是个静态的模块化打包工具,包括以下部分。

1.打包bundler:webpack可以将帮助我们进行打包,所以它是一个打包工具。

2.静态的static:这样表述的原因是我们最终可以将代码打包成最终的静态资源(部署到静态服务器)。

3.模块化module:webpack默认支持各种模块化开发,ES Module、CommonJS、AMD等。

2.webpack到底是如何对我们的项目进行打包的呢?

事实上webpack在处理应用程序时,它会根据命令或者配置文件找到入口文件;

从入口开始,会生成一个 依赖关系图,这个依赖关系图会包含应用程序中所需的所有模块(比如.js文件、css文件、图片、字体等);

然后遍历图结构,打包一个个模块(根据文件的不同使用不同的loader来解析);

Webpack依赖图
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • 什么是Webpack-----模块打包工具 WebPack可以看做是模块打包机:它做的事情是,分析你的项目结构,找...
    Susie_53b5阅读 2,563评论 0 0
  • 1.webpack简介 1.1 webpack是什么? CommonJS和AMD是用于JavaScript模块管理...
    浅笑6666阅读 2,394评论 0 1
  • 前言: 我最近需要整理一下 webpack 这个前端构建工具的相关知识,希望对前端工程化的和模块化有更多的理解,我...
    Joah_l阅读 11,440评论 0 9
  • 1.webpack是什么? 最开始是一个基于node的js打包工具。 简单来说,webpack是一个(bundle...
    violet_syls阅读 3,555评论 0 0
  • 1.webpack打包原理把所有依赖打包成一个 bundle.js 文件,通过代码分割成单元片段并按需加载。2.w...
    J_Ronaldo阅读 4,140评论 1 18

友情链接更多精彩内容