Diferencias

Muestra las diferencias entre dos versiones de la página.

--- wiki2:js_dev [2018/09/18 08:33]
alfred [Webpack]
+++ — (actual)
@@ Línea 1: / Línea 1: @@
-====== JavaScript Development Tools ======
-===== Webpack =====
-''webpack src/js/app.js dist/bundle.js'' es el comando básico, una vez añadido webpack, para generar un bundle.js. Webpack puede realizar otras tareas de optimización y minimización si añadimos que es para producción con ''-p''.
-Lo que hace es pillar a partir de los imports dentro del código js qué construir.
-Añadiendo **webpack-dev-server** como pacate al proyecto y substituyendo el comando de ejecución ''webpack'' por ''webpack-dev-server'' se nos añade un dev web server que nos permite hacer reload de los ficheros y demás. El comando sería: ''webpack-dev-server --entry ./src/js/apps.js ---output ./dist/bundle.js''.
-==== Configuración ====
-Webpack necesita un entry point y un output. Usa modulos y plugins para transformar el contenido desde el entry al output.
-Para escoger un fichero config (diferente al por defecto: ''webpack.config.js'') se puede añadir ''--config'' al comando. Con un archivo por defecto no necesitamos añadir parámetros al comando de ejecución.
-<code>
-var path = require('path');
-module.exports = {
-  entry: './src/js/app.js',
-  output: {
-    path: path.resolve(__dirname, 'dist'),
-    filename: 'bundle.js',
-    publicPath: '/dist'  // Para el webpack-dev-server, donde encontrar los ficheros
-  }
-}
-</code>

Programming