Das AWS SDK for JavaScript V3-API-Referenzhandbuch beschreibt im Detail alle API-Operationen für die AWS SDK for JavaScript Version 3 (V3).

Die vorliegende Übersetzung wurde maschinell erstellt. Im Falle eines Konflikts oder eines Widerspruchs zwischen dieser übersetzten Fassung und der englischen Fassung (einschließlich infolge von Verzögerungen bei der Übersetzung) ist die englische Fassung maßgeblich.

Anwendungen mit Webpack bündeln

Die Verwendung von Codemodulen durch Webanwendungen in Browserskripten oder Node.js erzeugt Abhängigkeiten. Diese Codemodule können eigene Abhängigkeiten haben, was zu einer Sammlung von miteinander verbundenen Modulen führt, die Ihre Anwendung benötigt, um zu funktionieren. Um Abhängigkeiten zu verwalten, können Sie einen Modul-Bundler wie verwendenwebpack.

Der webpack Modul-Bundler analysiert Ihren Anwendungscode und sucht nach - import oder -requireAnweisungen, um Pakete zu erstellen, die alle Komponenten enthalten, die Ihre Anwendung benötigt. Auf diese Weise können die Komponenten einfach über eine Webseite bereitgestellt werden. Das SDK für JavaScript kann in webpack als eine der Abhängigkeiten enthalten sein, die im Ausgabe-Bundle enthalten sein sollen.

Weitere Informationen zu webpackfinden Sie im Webpack-Modul-Bundler auf GitHub.

Installieren von Webpack

Um den webpack Modul-Bundler zu installieren, müssen Sie zuerst npm, den Node.js-Paketmanager, installiert haben. Geben Sie den folgenden Befehl ein, um die webpack CLI und das JavaScript Modul zu installieren.

npm install --save-dev webpack

Um das path Modul für die Arbeit mit Datei- und Verzeichnispfaden zu verwenden, das automatisch mit Webpack installiert wird, müssen Sie möglicherweise das Node.js-path-browserifyPaket installieren.

npm install --save-dev path-browserify

Webpack konfigurieren

Standardmäßig sucht Webpack nach einer JavaScript Datei mit dem Namen webpack.config.js im Stammverzeichnis Ihres Projekts. Diese Datei enthält Ihre Konfigurationsoptionen. Im Folgenden finden Sie ein Beispiel für eine webpack.config.js Konfigurationsdatei für WebPack Version 5.0.0 und höher.

// Import path for resolving file paths
var path = require("path");
module.exports = {
  // Specify the entry point for our app.
  entry: [path.join(__dirname, "browser.js")],
  // Specify the output file containing our bundled code.
  output: {
    path: __dirname,
    filename: 'bundle.js'
  },
   // Enable WebPack to use the 'path' package.
   resolve:{
  fallback: { path: require.resolve("path-browserify")}
  }
  /**
  * In Webpack version v2.0.0 and earlier, you must tell 
  * webpack how to use "json-loader" to load 'json' files.
  * To do this Enter 'npm --save-dev install json-loader' at the 
  * command line to install the "json-loader' package, and include the 
  * following entry in your webpack.config.js.
  * module: {
    rules: [{test: /\.json$/, use: use: "json-loader"}]
  }
  **/
};

In diesem Beispiel browser.js wird als Eintrittspunkt angegeben. Der Einstiegspunkt ist die Datei, die webpack verwendet, um nach importierten Modulen zu suchen. Der Name für die Ausgabedatei ist als bundle.js angegeben. Diese Ausgabedatei enthält alle , die JavaScript die Anwendung zum Ausführen benötigt. Wenn der im Einstiegspunkt angegebene Code andere Module importiert oder erfordert, z. B. das SDK für JavaScript, wird dieser Code gebündelt, ohne ihn in der Konfiguration angeben zu müssen.

Webpack ausführen

Um eine Anwendung für die Verwendung von zu erstellenwebpack, fügen Sie dem -scriptsObjekt in Ihrer -package.jsonDatei Folgendes hinzu.

"build": "webpack"

Im Folgenden finden Sie eine package.json Beispieldatei, die das Hinzufügen von demonstriertwebpack.

{
  "name": "aws-webpack",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "build": "webpack"
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "@aws-sdk/client-iam": "^3.32.0",
    "@aws-sdk/client-s3": "^3.32.0"
  },
  "devDependencies": {
    "webpack": "^5.0.0"
  }
}

Geben Sie den folgenden Befehl ein, um Ihre Anwendung zu erstellen.

npm run build

Der webpack Modul-Bundler generiert dann die JavaScript Datei, die Sie im Stammverzeichnis Ihres Projekts angegeben haben.

Verwenden des Webpack-Pakets

Um das Paket in einem Browserskript zu verwenden, können Sie das Paket mithilfe eines <script> Tags integrieren, wie im folgenden Beispiel gezeigt.

<!DOCTYPE html>
<html>
    <head>
        <title>Amazon SDK with webpack</title>
    </head> 
    <body>
        <div id="list"></div>
        <script src="bundle.js"></script>
    </body>
</html>

Bündel für Node.js

Sie können verwenden, webpack um Pakete zu generieren, die in Node.js ausgeführt werden, indem Sie node als Ziel in der Konfiguration angeben.

target: "node"

Dies ist nützlich, wenn eine Node.js-Anwendung in einer Umgebung ausgeführt wird, in der Speicherplatz begrenzt ist. Hier sehen Sie ein Beispiel für eine webpack.config.js-Konfiguration mit der Angabe von Node.js als Ausgabeziel.

// Import path for resolving file paths
var path = require("path");
module.exports = {
  // Specify the entry point for our app.
  entry: [path.join(__dirname, "browser.js")],
  // Specify the output file containing our bundled code.
  output: {
    path: __dirname,
    filename: 'bundle.js'
  },
  // Let webpack know to generate a Node.js bundle.
  target: "node",
   // Enable WebPack to use the 'path' package.
   resolve:{
  fallback: { path: require.resolve("path-browserify")}
   /**
   * In Webpack version v2.0.0 and earlier, you must tell 
   * webpack how to use "json-loader" to load 'json' files.
   * To do this Enter 'npm --save-dev install json-loader' at the 
   * command line to install the "json-loader' package, and include the 
   * following entry in your webpack.config.js.
   module: {
    rules: [{test: /\.json$/, use: use: "json-loader"}]
  }
  **/
};