Rspack 2.0 完整指南：Rust 打包工具與 Webpack 遷移實戰 2026

什麼是 Rspack 2.0？

在前端開發工具鏈的演進史上，2026 年是 Rust 語言工具全面取代 JavaScript 工具的關鍵節點。Rspack 2.0 是由字節跳動開源的高效能 JavaScript/TypeScript 打包工具，用 Rust 重新實現了 webpack 的核心，同時保持幾乎完整的 webpack API 相容性。

與其他 Rust 打包工具（如 Vite、esbuild、Turbopack）的最大差異在於：Rspack 不是要求你重寫配置或棄用 webpack 生態系，而是讓你「用最小的改動換取最大的速度提升」。這對於有大量 webpack 配置投資的企業級專案來說，是一個極具吸引力的遷移路徑。

Rspack 2.0 在 2025 年底發布，帶來了模組聯邦 2.0（Module Federation 2.0）、增量式 TypeScript 類型檢查，以及基於 SWC 的轉譯層大幅改進。

效能 Benchmark：Rspack vs Webpack vs Vite

以一個包含 5,000 個模組的 React 應用為基準進行測試：

Rspack 2.0 的生產建構速度是最大亮點：比 Webpack 快 8.4 倍，比 Vite+Rollup 快 3 倍。這對於 CI/CD 流水線的效率影響極大，特別是在大型程式碼庫中。

開發模式下，Rspack 的冷啟動速度略慢於 Vite，這是因為 Rspack 需要預先分析整個依賴圖（與 Webpack 相同的策略），而 Vite 採用按需轉譯的策略。但在複雜應用中，Rspack 的增量建構優勢會逐漸顯現。

Rspack 2.0 新功能

1. 模組聯邦 2.0（Module Federation 2.0）

Rspack 2.0 提供了最完整的 Module Federation 2.0 實作，支援跨框架（React、Vue、Angular）的微前端架構，並新增了動態遠端載入、類型安全的跨應用通訊。

2. 增量式 TypeScript 類型檢查

整合了 TypeScript 編譯器服務的增量式類型檢查，在修改一個檔案後只重新檢查受影響的模組，類型檢查速度提升 60%。

3. 原生持久快取（Persistent Cache）

Rspack 2.0 的持久快取基於檔案系統快取，重啟後可以恢復建構狀態，二次建構速度比冷建構快 70%。

4. 整合 Biome 格式化

新增對 Biome 的原生整合，可以在建構過程中同時執行 lint 和格式化。搭配Biome 統一前端工具鏈指南，可以大幅簡化前端工具鏈配置。

從 Webpack 遷移的完整步驟

第一步：安裝 Rspack

npm install @rspack/core @rspack/cli -D
# 或使用 rspack-cli 遷移工具
npx @rspack/migration-tool

第二步：修改配置檔案

將 webpack.config.js 重命名為 rspack.config.js，並更新 import：

// webpack.config.js → rspack.config.js
const { rspack } = require('@rspack/core');
// const webpack = require('webpack'); // 移除這行

module.exports = {
  // 大部分配置保持不變！
  entry: './src/index.tsx',
  output: {
    path: path.resolve(__dirname, 'dist'),
    filename: '[name].[contenthash].js',
  },
  module: {
    rules: [
      {
        test: /\.tsx?$/,
        use: 'builtin:swc-loader', // 替換 babel-loader
        exclude: /node_modules/,
      },
      // CSS loader 語法保持不變
      {
        test: /\.css$/,
        use: ['style-loader', 'css-loader', 'postcss-loader'],
      },
    ],
  },
  plugins: [
    new rspack.HtmlRspackPlugin({ template: './public/index.html' }),
    // 移除 HtmlWebpackPlugin，改用 HtmlRspackPlugin
  ],
};

第三步：更新 package.json 腳本

"scripts": {
  "start": "rspack serve",
  "build": "rspack build",
  "build:analyze": "RSPACK_PROFILE=ALL rspack build"
}

Loader 與 Plugin 相容性指南

大部分 webpack loader 和 plugin 可以在 Rspack 中直接使用，但有些需要替換為原生版本以獲得最佳效能：

React 與 Next.js 整合

Rspack 提供了官方的 React 支援工具包 @rspack/plugin-react-refresh，整合 React Fast Refresh 實現完美的熱更新體驗：

const { ReactRefreshRspackPlugin } = require('@rspack/plugin-react-refresh');

module.exports = {
  plugins: [
    new ReactRefreshRspackPlugin(),
  ],
  module: {
    rules: [{
      test: /\.tsx?$/,
      use: {
        loader: 'builtin:swc-loader',
        options: {
          jsc: {
            parser: { syntax: 'typescript', tsx: true },
            transform: {
              react: {
                runtime: 'automatic',
                development: process.env.NODE_ENV === 'development',
                refresh: process.env.NODE_ENV === 'development',
              },
            },
          },
        },
      },
    }],
  },
};

對於使用 Next.js 的開發者，Rspack 目前通過 Turbopack 相容層支援部分 Next.js 功能。完整的 Next.js PPR 功能需要原生 Turbopack，詳見Next.js PPR 部分預渲染 LCP 優化教學。

在 React 19 效能最佳化方面，Rspack 的建構輸出與React 19.2 cacheSignal Performance Tracks完全相容，可以無縫使用最新的 React 並發特性。

進階配置與最佳化

程式碼分割（Code Splitting）

module.exports = {
  optimization: {
    splitChunks: {
      chunks: 'all',
      cacheGroups: {
        vendor: {
          test: /node_modules/,
          name: 'vendors',
          priority: 10,
        },
        common: {
          minChunks: 2,
          priority: 5,
          reuseExistingChunk: true,
        },
      },
    },
  },
};

持久快取配置

module.exports = {
  cache: {
    type: 'filesystem',
    cacheDirectory: path.resolve(__dirname, '.rspack-cache'),
    // 快取失效條件
    buildDependencies: {
      config: [__filename],
    },
  },
};

結語

Rspack 2.0 代表了前端建構工具從 JavaScript 到 Rust 遷移浪潮的成熟階段。它不是要求你重新學習一套新工具，而是讓你在熟悉的 webpack 生態系中享受 Rust 的速度優勢。

對於正在使用 webpack 的中大型專案，Rspack 是目前風險最低、收益最高的遷移選擇：遷移成本低、速度提升顯著、生態系相容性最佳。如果你正在為 CI/CD 的建構時間頭痛，今天就值得花半天時間試試看 Rspack 2.0。