Saltar al contenido

Webpack cómo construir código de producción y cómo usarlo

Vivian, parte de nuestro staff, nos ha hecho el favor de redactar esta crónica ya que controla a la perfección este tema.

Solución:

Puede agregar los complementos como lo sugiere @Vikramaditya. Luego, para generar la compilación de producción. Tienes que ejecutar el comando

NODE_ENV=production webpack --config ./webpack.production.config.js

si usa babeltambién necesitarás prefix BABEL_ENV=node al comando anterior.

Después de observar el número de espectadores a esta pregunta, decidí concluir una respuesta de Vikramaditya y Sandeep.

Para construir el código de producción, lo primero que debe crear es la configuración de producción con paquetes de optimización como,

  new webpack.optimize.CommonsChunkPlugin('common.js'),
  new webpack.optimize.DedupePlugin(),
  new webpack.optimize.UglifyJsPlugin(),
  new webpack.optimize.AggressiveMergingPlugin()

Luego, en el archivo package.json, puede configurar el procedimiento de compilación con esta configuración de producción

"scripts": 
    "build": "NODE_ENV=production webpack --config ./webpack.production.config.js"
,

ahora debe ejecutar el siguiente comando para iniciar la compilación

npm run build

Según mi configuración de compilación de producción, el paquete web compilará la fuente para ./dist directorio.

Ahora su código de interfaz de usuario estará disponible en ./dist/ directorio. Configure su servidor para servir estos archivos como static activos. ¡Hecho!

Use estos complementos para optimizar su compilación de producción:

  new webpack.optimize.CommonsChunkPlugin('common'),
  new webpack.optimize.DedupePlugin(),
  new webpack.optimize.UglifyJsPlugin(),
  new webpack.optimize.AggressiveMergingPlugin()

Hace poco me enteré de compresión-webpack-complemento
que gzips su paquete de salida para reducir su tamaño. Agregue esto también en la lista de complementos enumerados anteriormente para optimizar aún más su código de producción.

new CompressionPlugin(.html$/,
      threshold: 10240,
      minRatio: 0.8
)

No se recomienda la compresión gzip dinámica del lado del servidor para servir static archivos del lado del cliente debido al uso intensivo de la CPU.

¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *