Rollup 核心功能实现

这是一个简化版的 Rollup 实现，展示了模块打包的核心功能。

项目结构

04-core-feature/
├── src/
│   ├── bundler.js         # 打包器
│   ├── parser.js          # 解析器
│   └── resolver.js        # 模块解析器
├── test/
│   └── bundler.test.js
├── package.json
└── README.md

核心功能

1. 模块解析

解析模块依赖。

功能:

• 模块路径解析
• 依赖分析
• 循环依赖检测

2. 模块打包

打包模块为 bundle。

功能:

• 模块图构建
• 代码生成
• Tree-shaking

3. 插件系统

支持插件扩展。

功能:

• 插件钩子
• 插件执行
• 插件配置

使用方法

安装依赖

npm install

运行测试

npm test

实现细节

模块解析

解析模块路径：

function resolveModule(source, importer) {
  // 解析相对路径
  if (source.startsWith('./') || source.startsWith('../')) {
    return resolveRelative(source, importer)
  }
  
  // 解析 node_modules
  return resolveNodeModules(source, importer)
}

模块图构建

构建依赖图：

function buildModuleGraph(entry) {
  const graph = new Map()
  const visited = new Set()
  
  function visit(moduleId) {
    if (visited.has(moduleId)) return
    
    visited.add(moduleId)
    const module = loadModule(moduleId)
    graph.set(moduleId, module)
    
    for (const dep of module.dependencies) {
      visit(dep)
    }
  }
  
  visit(entry)
  return graph
}

Tree-shaking

移除未使用的代码：

function treeShake(graph) {
  const usedExports = new Set()
  
  // 标记使用的导出
  markUsedExports(graph, usedExports)
  
  // 移除未使用的代码
  removeUnusedCode(graph, usedExports)
  
  return graph
}

应用场景

• 库打包 - 打包 JavaScript 库
• 应用打包 - 打包应用代码
• 代码优化 - 优化代码体积
• 模块转换 - 转换模块格式

总结

这个实现展示了 Rollup 的核心概念和架构，包括：

1. 模块解析 - 模块路径和依赖
2. 模块打包 - 模块图和代码生成
3. 插件系统 - 插件钩子和执行

通过这个实现，可以深入理解模块打包的原理和 Rollup 的设计理念。