从0开始一个React/ES6项目-Webpack初探番外

  • 之后有关webpack原理/流程的东西记录在这。

在开始之前,初学者都有一个问题,那就是:

webpack命令行是怎么实现的?

这里笔者也去看过webpack源码,除了./bin/webpack.js 中 首行通过#!/usr/bin/env node来指定该文件由node解释以外,主要是借助以下几个库来实现。

  • yargs, yargs可以轻松处理传参,定义—help用法等
  • interpret, 加载文件扩展名,寻找配置文件

具体实现命令行工具可以参考阮老师的另一篇文章,链接

其次,还好奇的是另外一个问题:

webpack是如何遍历所有的依赖并打包到指定文件?

这里从网上盗了一张图,清晰地展示了webpack执行的流程:
webpack执行流程

在webpack执行的流程中,有一步骤是专门使用acorn去生成AST语法树,并遍历require依赖后将它们加入依赖数组,这样就能获取到所有的依赖了,将它们打包在一块就不成问题了。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值