Einrichten der Entwicklungsumgebung

Dieser Leitfaden hilft Ihnen beim Einrichten von Tools, damit Sie Office Add-Ins erstellen können, indem Sie unsere Schnellstarts oder Lernprogramme befolgen. Sie müssen die Tools aus der folgenden Liste installieren. Wenn Sie diese bereits installiert haben, können Sie einen Schnellstart starten, z. B. diesen Excel React Schnellstart.

  • Node.js
  • npm
  • Ein Microsoft 365 Konto, das die Abonnementversion von Office
  • Ein Code-Editor Ihrer Wahl
  • Der Office JavaScript-Linter

In diesem Leitfaden wird davon ausgegangen, dass Sie wissen, wie Sie ein Befehlszeilentool verwenden.

Installieren von Node.js

Node.js eine JavaScript-Laufzeit ist, müssen Sie moderne Office-Add-Ins entwickeln.

Installieren Sie Node.js, indem Sie die neueste empfohlene Version von ihrer Website herunterladen. Folgen Sie den Installationsanweisungen für Ihr Betriebssystem.

Installieren von npm

npm ist eine Open Source-Softwareregistrierung zum Herunterladen der Pakete, die bei der Entwicklung von Office-Add-Ins verwendet werden.

Führen Sie folgende Schritte in der Befehlszeile aus, um npm zu installieren.

    npm install npm -g

Um zu überprüfen, ob npm bereits installiert ist und die installierte Version angezeigt wird, führen Sie in der Befehlszeile Folgendes aus.

npm -v

Möglicherweise möchten Sie einen Node-Versions-Manager verwenden, damit Sie zwischen mehreren Versionen von Node.js und npm wechseln können. Dies ist jedoch nicht unbedingt erforderlich. Ausführliche Informationen hierzu finden Sie in den Npm-Anweisungen.

Abrufen von Microsoft 365

Wenn Sie noch nicht über ein Microsoft 365 Konto verfügen, können Sie ein kostenloses, 90-tägiges verlängerbares Microsoft 365-Abonnement erhalten, das alle Office Apps enthält, indem Sie dem Microsoft 365-Entwicklerprogrammbeitreten.

Installieren eines Code-Editors

Sie können einen beliebigen Code-Editor oder eine beliebige IDE verwenden, der bzw. die die clientseitige Entwicklung unterstützt, um Ihren Webpart zu erstellen, z. B.:

Installieren und Verwenden des Office JavaScript-Linters

Microsoft stellt einen JavaScript-Linter bereit, mit dem Sie häufige Fehler bei der Verwendung der Office JavaScript-Bibliothek abfangen können. Führen Sie zum Installieren des Linters die folgenden beiden Befehle aus (nachdem Sie Node.jsund npm installiert haben).

npm install office-addin-lint --save-dev
npm install eslint-plugin-office-addins --save-dev

Wenn Sie ein Office-Add-In-Projekt mit dem Yo Office-Tool erstellen, wird der Rest des Setups für Sie erledigt. Führen Sie den Linter mit dem folgenden Befehl entweder im Terminal eines Editors aus, z. B. Visual Studio Code, oder in einer Eingabeaufforderung. Probleme, die vom Linter gefunden werden, werden im Terminal oder in der Eingabeaufforderung angezeigt und werden auch direkt im Code angezeigt, wenn Sie einen Editor verwenden, der Linternachrichten unterstützt, z. B. Visual Studio Code. (Informationen zum Installieren des Yo Office-Tools erhalten Sie in einem unserer Office-Add-In-Schnellstarts, z. B. diesem für Excel-Add-Ins.)

npm run lint

Wenn Ihr Add-In-Projekt auf eine andere Weise erstellt wurde, führen Sie die folgenden Schritte aus.

  1. Erstellen Sie im Stammverzeichnis des Projekts eine Textdatei mit dem Namen ".eslintrc.json", wenn noch keine vorhanden ist. Stellen Sie sicher, dass sie eigenschaften benannt plugins und beide vom Typ extends "Array" enthält. Das plugins Array sollte "office-addins" enthalten, und das Array sollte extends "plugin:office-addins/recommended" enthalten. Nachfolgend sehen Sie ein einfaches Beispiel. Ihre .eslintrc.json-Datei kann zusätzliche Eigenschaften und zusätzliche Member der beiden Arrays aufweisen.

    {
      "plugins": [
        "office-addins"
      ],
      "extends": [
        "plugin:office-addins/recommended"
      ]
    }
    
  2. Öffnen Sie im Stammverzeichnis des Projekts die Datei "package.json", und stellen Sie sicher, dass das scripts Array das folgende Element aufweist.

    "lint": "office-addin-lint check",
    
  3. Führen Sie den Linter mit dem folgenden Befehl entweder im Terminal eines Editors aus, z. B. Visual Studio Code, oder in einer Eingabeaufforderung. Probleme, die vom Linter gefunden werden, werden im Terminal oder in der Eingabeaufforderung angezeigt und werden auch direkt im Code angezeigt, wenn Sie einen Editor verwenden, der Linternachrichten unterstützt, z. B. Visual Studio Code.

    npm run lint
    

Nächste Schritte

Versuchen Sie, Ein eigenes Add-In zu erstellen, oder verwenden Sie Script Lab, um integrierte Beispiele auszuprobieren.

Erstellen eines Office-Add-Ins

Sie können schnell ein einfaches Add-In für Excel, OneNote, Outlook, PowerPoint, Project oder Word erstellen, indem Sie einen 5-Minuten-Schnellstartausführen. Wenn Sie bereits einen Schnellstart abgeschlossen haben und ein etwas komplexeres Add-In erstellen möchten, sollten Sie das Lernprogramm ausprobieren.

Erkunden der APIs mithilfe von Script Lab

Erkunden Sie die Bibliothek mit integrierten Beispielen in Script Lab, um eine Vorstellung von den Funktionen der Office JavaScript-APIs zu erhalten.

Siehe auch