La Guida di riferimento dell'API AWS SDK for JavaScript V3 descrive in dettaglio tutte le operazioni API per la AWS SDK for JavaScript versione 3 (V3).

Le traduzioni sono generate tramite traduzione automatica. In caso di conflitto tra il contenuto di una traduzione e la versione originale in Inglese, quest'ultima prevarrà.

Raggruppa le applicazioni con webpack

L'uso di moduli di codice da parte delle applicazioni Web negli script del browser o in Node.js crea dipendenze. Questi moduli di codice possono avere dipendenze proprie, generando una raccolta di moduli interconnessi richiesti dall'applicazione per funzionare. Per gestire le dipendenze, puoi usare un bundler di moduli come. webpack

Il bundler di webpack moduli analizza il codice dell'applicazione, cercando le nostre require istruzioni, import per creare pacchetti che contengono tutte le risorse di cui l'applicazione ha bisogno. In questo modo le risorse possono essere facilmente servite tramite una pagina Web. L'SDK for JavaScript può essere incluso webpack come una delle dipendenze da includere nel pacchetto di output.

Per ulteriori informazioni in meritowebpack, consulta il bundler del modulo webpack su. GitHub

Installa webpack

Per installare il bundler del webpack modulo, devi prima avere installato npm, il gestore di pacchetti Node.js. Digita il comando seguente per installare la webpack CLI e JavaScript il modulo.

npm install --save-dev webpack

Per utilizzare il path modulo per lavorare con i percorsi di file e directory, che viene installato automaticamente con webpack, potrebbe essere necessario installare il pacchetto Node.jspath-browserify.

npm install --save-dev path-browserify

Configura webpack

Per impostazione predefinita, Webpack cerca un JavaScript file denominato webpack.config.js nella directory principale del progetto. Questo file specifica le opzioni di configurazione. Di seguito è riportato un esempio di file di webpack.config.js configurazione per la WebPack versione 5.0.0 e successive.

// 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 questo esempio, browser.js viene specificato come punto di ingresso. Il punto di ingresso è il file webpack utilizzato per iniziare la ricerca dei moduli importati. Come bundle.js è specificato il nome del file di output. Questo file di output conterrà tutto JavaScript il necessario per l'esecuzione dell'applicazione. Se il codice specificato nel punto di ingresso importa o richiede altri moduli, come l'SDK for JavaScript, quel codice viene fornito in bundle senza bisogno di specificarlo nella configurazione.

Esegui webpack

Per creare un'applicazione da usarewebpack, aggiungi quanto segue all'scriptsoggetto nel tuo package.json file.

"build": "webpack"

Di seguito è riportato un package.json file di esempio che dimostra l'aggiuntawebpack.

{
  "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"
  }
}

Per creare la tua applicazione, inserisci il seguente comando.

npm run build

Il bundler del webpack modulo genera quindi il JavaScript file specificato nella directory principale del progetto.

Usa il pacchetto webpack

Per utilizzare il pacchetto in uno script del browser, puoi incorporarlo utilizzando un <script> tag, come mostrato nell'esempio seguente.

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

Bundle per Node.js

È possibile webpack utilizzarlo per generare pacchetti che vengono eseguiti in Node.js specificandolo node come destinazione nella configurazione.

target: "node"

Questa funzione è utile quando si esegue un'applicazione Node.js in un ambiente in cui lo spazio su disco è limitato. Ecco un esempio di configurazione webpack.config.js con Node.js specificato come destinazione dell'output.

// 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"}]
  }
  **/
};