React Compiler in WXT aktivieren

Wenn Sie React Compiler in WXT aktivieren, werden Komponenten automatisch optimiert.

Dadurch braucht man manuelle useCallback- und useMemo-Optimierungen deutlich seltener, und der Code bleibt einfacher.

Installation

Installieren Sie zuerst das Paket babel-plugin-react-compiler.

Wenn Sie pnpm verwenden:

pnpm add -D babel-plugin-react-compiler

Wenn Sie Bun verwenden:

bun add -D babel-plugin-react-compiler

WXT-Konfigurationsdatei anpassen

Fügen Sie die Babel-Plugin-Konfiguration für React Compiler in wxt.config.ts hinzu.

export default defineConfig({
  react: {
    vite: {
      babel: {
        plugins: [["babel-plugin-react-compiler"]],
      }
    }
  }
})

Damit ist React Compiler aktiviert und Ihre Komponenten werden beim Build automatisch optimiert.

Zusammenfassung

Um React Compiler in WXT zu verwenden, installieren Sie lediglich babel-plugin-react-compiler und tragen es in die Babel-Plugin-Liste der Konfiguration ein.

Das reduziert manuelle Optimierung und verbessert die Lesbarkeit des Codes.