La Guía de referencia de la API de AWS SDK for JavaScript V3 describe en detalle todas las operaciones de la API para la versión 3 (V3) de AWS SDK for JavaScript.

Las traducciones son generadas a través de traducción automática. En caso de conflicto entre la traducción y la version original de inglés, prevalecerá la version en inglés.

Combine aplicaciones con webpack

El uso de módulos de código por parte de aplicaciones web en scripts de navegador o Node.js crea dependencias. Estos módulos de código pueden tener dependencias propias, lo que se traduce en una colección de módulos interconectados que su aplicación necesita para funcionar. Para administrar dependencias, puede utilizar un instalador de módulos como Webpack.

El instalador de módulos Webpack analiza el código de la aplicación para buscar instrucciones import o require y crear agrupaciones que contengan todos los recursos que la aplicación necesita. Esto es para que los activos se puedan servir fácilmente a través de una página web. El SDK para se JavaScript puede incluir webpack como una de las dependencias para incluirlo en el paquete de salida.

Para obtener más información al respectowebpack, consulte el paquete de módulos webpack en. GitHub

Instale webpack

Para instalar el instalador de módulos Webpack, en primer lugar debe tener npm, el administrador de paquetes de Node.js, instalado. Escriba el siguiente comando para instalar la webpack CLI y el JavaScript módulo.

npm install --save-dev webpack

Para usar el módulo path para trabajar con rutas de archivos y directorios, que se instala automáticamente con Webpack, es posible que necesite instalar el paquete path-browserify de Node.js.

npm install --save-dev path-browserify

Configure el paquete web

De forma predeterminada, Webpack busca un JavaScript archivo con un nombre webpack.config.js en el directorio raíz de tu proyecto. Este archivo especifica sus opciones de configuración. El siguiente es un ejemplo de un archivo de webpack.config.js configuración para la WebPack versión 5.0.0 y versiones posteriores.

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

En este ejemplo, browser.js se especifica como el punto de entrada. El punto de entrada es el archivo que Webpack utiliza para comenzar a buscar módulos importados. El nombre de archivo de la salida se especifica como bundle.js. Este archivo de salida contendrá todo lo que JavaScript la aplicación necesita para ejecutarse. Si el código especificado en el punto de entrada importa o requiere otros módulos, como el SDK JavaScript, ese código se incluye sin necesidad de especificarlo en la configuración.

Ejecute webpack

Para desarrollar una aplicación para utilizar Webpack, añada lo siguiente al objeto scripts de su archivo package.json.

"build": "webpack"

El siguiente es un archivo package.json de ejemplo que muestra cómo agregar Webpack.

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

Para compilar su aplicación, introduzca el comando siguiente.

npm run build

Luego, el paquete de webpack módulos genera el JavaScript archivo que especificó en el directorio raíz de su proyecto.

Usa el paquete webpack

Para utilizar la agrupación en un script de navegador, puede incorporar la agrupación con una etiqueta <script>, tal y como se muestra en el siguiente ejemplo.

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

Paquete para Node.js

Puede utilizar Webpack para generar agrupaciones que se ejecutan en Node.js especificando node como destino en la configuración.

target: "node"

Esto resulta útil al ejecutar una aplicación de Node.js en un entorno donde el espacio en el disco es limitado. A continuación se muestra un ejemplo de configuración de webpack.config.js con Node.js especificado como destino de salida.

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