Lo que es webpack

Webpack es una herramienta de front-end para construir secuencias de comandos del módulo de JavaScript para navegadores.

Se puede utilizar similar a Browserify y hacer mucho más.

$ Browserify main.js> bundle.js
# Equivaldría a
$ Webpack main.js bundle.js

Webpack necesita un archivo de configuración llamado  webpack.config.js que es sólo un módulo de CommonJS.

// webpack.config.js
module.exports = {
  entrada:', ./main.js
  Salida: {
    Nombre del archivo: 'bundle.js'
  }
};

Después de tener  webpack.config.js, puede invocar webpack sin ningún argumento.

$ webpack

Algunas opciones de línea de comandos que deben saber.

  • webpack - la construcción para el desarrollo
  • webpack -p - la construcción para la producción (minimización)
  • webpack --watch - para la construcción gradual continua
  • webpack -d - incluyendo mapas fuente
  • webpack --colors - Salida de la construcción haciendo bastante

Usted puede personalizar  scripts campo en el archivo de package.json de la siguiente manera.

// package.json
{
  // ...
  "guiones": {
    "Dev": "webpack-dev-servidor --devtool eval --progress --colores",
    "Despliegue": "NODE_ENV = webpack producción -p"
  },
  // ...
}

$ NPM i -g webpack webpack-dev-servidor

A continuación, clonar el repositorio.

$ Git clone https://github.com/xxxx.git

Instalar las dependencias.

$ cd WebPack-Demos
$ NPM instalar

Ahora, a jugar con los archivos de origen en virtud de los pases pasivos demostración directorios *.

$ Cd demo01
$ Dev NPM plazo

Si el comando anterior no se abre automáticamente el navegador, usted tiene que visitar  http://127.0.0.1:8080  por sí mismo.


 

Publicados 429 artículos originales · ganado elogios 410 · Vistas 9.2 millones +

Supongo que te gusta

Origin blog.csdn.net/aerchi/article/details/104575212
Recomendado
Clasificación