webpack的源代码分析:从入口到构建出一个文件
程序员文章站
2022-06-24 11:38:49
源代码入口我们调用yarn run react:build调用的是webpack的命令,具体命令在这个路径~/workspace/mep-ui-sso/node_modules/.bincat webpack, 这个命令本身是个快捷方式,里面调用了npm的webpack包的入口js,```var localWebpack = require.resolve(path.join(process.cwd(), “node_modules”, “webpack”, “bin”, “webpack.js...
源代码入口
1. 我们调用yarn run react:build
调用的是webpack的命令
具体命令在这个路径~/workspace/mep-ui-sso/node_modules/.bin
2. cat webpack, 这个命令本身是个快捷方式,
里面调用了npm的webpack包的入口js,
var localWebpack = require.resolve(path.join(process.cwd(), "node_modules", "webpack", "bin", "webpack.js"));
其中最终实例化出的对象是
所以一个疑问是js如何获取路径?
require包
requirejs中可以使用相对路径和绝对路径,绝对路径需要注意的是使用需要添加上.js后缀 https://www.jianshu.com/p/c112e2d21521
因为是用快捷方式,所以说得通,所有相对路径都是包中的路径
最终实例化
项目文件夹: node_modules/webpack/lib/webpack.js
从定义看webpack就是个compiler
里面最主要是Compiler
继承了Tapable是个架构,插件架构,发布订阅Compilation
比如插件的运行,插件必须有一个apply方法,当插件被hook到tapable的框架时,回调apply方法,应用具体插件功能
本文地址:https://blog.csdn.net/wxid2798226/article/details/107169382
上一篇: 服务端之MVC和前后端分离对比