实现一个简易版Webpack
原理 1、解析一个文件及其依赖 2、构建一个依赖关系图 3、将所有东西打包成一个单文件 代码实现 文件结构 1、解析文件及其依赖 通过babylon将文件解析成AST 在线解析器 : 代码实现: bundle.js const fs = require("fs"); const babylon = require("babylon"); const traverse = require("babel-traverse").default; let ID = 0; function createAsset(filename) { const content = fs.readFileSync(filename, "utf-8"); // 解析文件成AST const ast = babylon.parse(content, { sourceType: "module", }); const dependencies = []; // 根据AST获取相关依赖 traverse(ast, { ImportDeclaration: ({ node }) => { dependencies.push(node.source.value); }, }); const id = ID++; return { id, filename, dependencies, }; } const