Next.js-config mit Typprüfung

So verwenden Sie die Typprüfung für Ihre next.config.js

Einfache Typprüfung für next.config.js

Dies ist nicht so sehr ein echter Artikel, sondern eher eine Neuveröffentlichung eines Teils der Next.js-Dokumentation, da ich es für wichtig halte, dass sie geteilt wird. Bezüglich der Verwendung von Typen für next.config.js gibt es keinen wirklichen offiziellen Support durch das Next.js-Team, da die Verwendung einer Typescript-Datei für diese Konfiguration ohne einige Hacks nicht möglich ist.

Seit Version 10.2.3 steht in der Dokumentation folgender Codeschnipsel zur Verfügung, um eine einfache Variante der Typprüfung zu ermöglichen. Beachten Sie, dass wir Typescript verwenden, aber die Konfigurationsdatei wird nicht vom Bundler des Projekts transpiliert. Das verwendete Feature ist das "@type"-Tag von JSDoc, um Typen in eine JS-Datei zu importieren.

// Add the following line at the top of the file:
// @ts-check

// Then for the config itself, import the types
// via '@type'-tag.

 /**
  * @type {import('next/dist/next-server/server/config').NextConfig}
  **/
 const nextConfig = {
   /* config options here */
 }

// End of file.
module.exports = nextConfig

Natürlich können Sie auch eine benutzerdefinierte Typescript-Konfiguration und einen Präprozessorschritt einrichten, um die Konfiguration selbst in Javascript zu transpilieren. Aber im Moment denke ich, dass sich der Aufwand nicht lohnt, da es von Plugin-Anbietern keine wesentliche Unterstützung für Typescript gibt. Sie haben also am Ende Typen für Ihre Basiskonfiguration, benötigen aber immer noch „any“ für alle anderen Plugins ohne Typen.

Vorschläge

Verwandt

Anhang

Sprachen