Das AWS SDK for JavaScript APIV3-Referenzhandbuch beschreibt detailliert alle API Funktionen 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 -require
Anweisungen, 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 webpack
finden Sie im Webpack-Modul-Bundler
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-browserify
Paket 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.
Anmerkung
Die Webpack-Konfigurationsanforderungen variieren je nach installierter Webpack-Version. Weitere Informationen finden Sie in der Webpack-Dokumentation
// 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 -scripts
Objekt in Ihrer -package.json
Datei 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"}] } **/ };