> ## Documentation Index
> Fetch the complete documentation index at: https://docs.appsignal.com/llms.txt
> Use this file to discover all available pages before exploring further.

# AppSignal für JavaScript installieren

Wenn Sie eine neue Anwendung zu AppSignal hinzufügen, befolgen Sie bitte zuerst die [Installationsanleitung](/guides/new-application).

## Einen Push-API-Schlüssel erstellen

Bevor Sie beginnen, müssen Sie Ihren Push-API-Schlüssel im [Bereich „Push and deploy"](https://appsignal.com/redirect-to/app?to=info) auf der Seite mit den Einstellungen Ihrer App finden. Ihren API-Schlüssel finden Sie unter „Front-end error monitoring". Sobald Sie Ihren Schlüssel haben, folgen Sie den Anweisungen im Abschnitt [Installation](#installation), um ihn in Ihrer Anwendung zu verwenden.

## Installation

### Mit npm oder yarn

Fügen Sie zunächst das Paket `@appsignal/javascript` zu Ihrer `package.json` hinzu. Führen Sie dann `yarn install`/`npm install` aus. Außerdem benötigen Sie einen Front-end-Error-Monitoring-Schlüssel aus dem [Bereich „Push and deploy"](https://appsignal.com/redirect-to/app?to=info) auf der Seite mit den Einstellungen Ihrer App.

Sie können diese Pakete auch auf der Kommandozeile zu Ihrer `package.json` hinzufügen:

<CodeGroup>
  ```bash Bash theme={null}
  yarn add @appsignal/javascript
  npm install @appsignal/javascript
  ```
</CodeGroup>

### Mit JSPM.dev

<Warning>
  Es wird nicht empfohlen, das JSPM.dev-CDN in der Produktion zu verwenden. Für
  ein produktionsreifes Setup ohne Build-Schritt empfehlen wir die Verwendung von
  [JSPM.io Import Maps](#with-jspmio-import-maps).
</Warning>

Dank des JSPM-CDN ist es möglich, die AppSignal-für-JavaScript-Integration ohne einen Front-end-Asset-Build-Schritt zu verwenden. Ihre Anwendung kann Pakete direkt aus dem CDN importieren:

<CodeGroup>
  ```js JavaScript theme={null}
  import Appsignal from "https://jspm.dev/@appsignal/javascript";
  ```
</CodeGroup>

### Mit JSPM.io Import Maps

Mit dem [JSPM.io Import Map Generator](https://generator.jspm.io/) können Sie eine Import Map für die Abhängigkeiten Ihrer Anwendung generieren.

Fügen Sie `@appsignal/javascript` zur Liste der Abhängigkeiten hinzu, und integrieren Sie dann die generierte Import Map sowie ES-Module-Shims in den Code Ihrer Anwendung.

### Mit `rails-importmap`

Verwenden Sie den folgenden Befehl, um diese Pakete zu den Import Maps Ihrer Rails-Anwendung hinzuzufügen:

<CodeGroup>
  ```sh Shell theme={null}
  ./bin/importmap pin @appsignal/javascript
  ```
</CodeGroup>

## Verwendung

Erstellen Sie eine `appsignal.js`-Datei, um AppSignal einzubinden und zu konfigurieren. Aus dieser Datei exportieren wir die Instanz des `Appsignal`-Objekts, die wir aus unserer Anwendung verwenden werden. Weitere Informationen zur Konfiguration finden Sie in unserem [Konfigurationsabschnitt](/front-end/configuration).

<CodeGroup>
  ```javascript JavaScript theme={null}
  // For ES Module via npm/yarn, or with import maps
  import Appsignal from "@appsignal/javascript";
  // For CommonJS module via npm/yarn
  const Appsignal = require("@appsignal/javascript").default;
  // With the JSPM.dev CDN
  import Appsignal from "https://jspm.dev/@appsignal/javascript";

  export const appsignal = new Appsignal({
    key: "YOUR FRONTEND API KEY",
  });
  ```
</CodeGroup>

Anschließend können Sie das `Appsignal`-Objekt in Ihrer App importieren und verwenden:

<CodeGroup>
  ```javascript JavaScript theme={null}
  // Place this at the top
  // Import the file created in the previous step
  import { appsignal } from "./appsignal";

  // Place your app code below this
  ```
</CodeGroup>

<Warning>
  **HINWEIS:** Wenn Sie ein CDN vor Ihren Assets betreiben, müssen Sie [zwei
  Änderungen](/front-end/troubleshooting) vornehmen, damit die Fehlerberichterstattung
  Fehler an unseren API-Endpunkt senden kann. Lesen Sie mehr über die [erforderlichen
  Änderungen](/front-end/troubleshooting).

  Wenn Sie Content Security Policy verwenden, achten Sie darauf, die richtigen Header hinzuzufügen, wie
  [hier beschrieben](/front-end/troubleshooting#content-security-policy-csp).
</Warning>

## Integrationen hinzufügen

Ihre Anwendung verwendet möglicherweise ein Framework oder eine Bibliothek, die AppSignal unterstützt.
Bitte sehen Sie sich den Abschnitt [Integrationen](/front-end/integrations) für jede Bibliothek an, die Ihre Anwendung verwendet, und folgen Sie den Anweisungen, um eine Instrumentierung für diese Bibliotheken hinzuzufügen.

[Integrationen zu Ihrer Anwendung hinzufügen](/front-end/integrations).

## Plugins hinzufügen

AppSignal bietet außerdem einige Plugins für JavaScript-Funktionalität im Browser.
Bitte sehen Sie sich den Abschnitt [Plugins](/front-end/plugins) für jede zusätzliche Instrumentierung an, die Sie zu Ihrer Anwendung hinzufügen möchten.

[Plugins zu Ihrer Anwendung hinzufügen](/front-end/plugins).

## Benutzerdefinierte Fehlerberichterstattung

Verwenden Sie kein Framework oder keine Bibliothek, möchten aber JavaScript-Fehler manuell melden?
Verwenden Sie unsere [Span-API](/front-end/span), um Spans zu erstellen, auf denen Sie Fehler melden, Tags hinzufügen und weitere Metadaten ergänzen.
Lesen Sie dann unseren [Leitfaden zur Fehlerbehandlung](/front-end/error-handling), wie Sie Fehler an AppSignal melden.

***

<Note>
  📖 Fahren Sie mit unserem [Installationsleitfaden](/guides/new-application) fort.
</Note>

## Deinstallation

Deinstallieren Sie AppSignal aus Ihrer App, indem Sie die folgenden Schritte ausführen. Wenn diese Schritte abgeschlossen sind, sendet Ihre App keine Daten mehr an die AppSignal-Server.

1. Löschen Sie in der `package.json` Ihrer App alle Zeilen, die auf ein `appsignal`-Paket verweisen: `"*appsignal/*": "*"`.

2. Führen Sie `npm install` oder `yarn install` aus, um Ihre `package.lock`/`yarn.lock` mit dem Stand der entfernten Pakete zu aktualisieren.
   * Alternativ können Sie `npm uninstall @appsignal/<package name>` oder `yarn remove @appsignal/<package name>` ausführen, um ein AppSignal-Paket zu deinstallieren.

3. Entfernen Sie alle AppSignal-[Konfigurationen](/front-end/configuration/) aus Ihrer App.

4. Committen, deployen und starten Sie Ihre App neu.
   * Damit wird sichergestellt, dass die AppSignal-Server keine Daten mehr von Ihrer App empfangen.

5. Schließlich [entfernen Sie die App](/guides/application/deleting-applications) auf AppSignal.com.

<Note>
  📖 Fahren Sie mit unserem [Deinstallationsleitfaden](/guides/application/deleting-applications) fort.
</Note>