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.

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.

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