Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

243
Vistas
¿Cómo actualizar automáticamente el navegador con el paquete web al cambiar?

Tengo este archivo backend-dev.js que es principalmente una configuración de paquete web. Lo uso para ejecutar mi servidor express desde el archivo incluido. Permanece encendido y reinicia el servidor ante cualquier cambio. ¿Hay alguna configuración posible que se pueda agregar para actualizar automáticamente el navegador también cada vez que cambie el código? Esto es lo que tengo en backend-dev.js :

 const path = require('path'); const webpack = require('webpack'); const spawn = require('child_process').spawn; const HtmlWebpackPlugin = require('html-webpack-plugin'); const compiler = webpack({ // add your webpack configuration here entry: './app.js', output: { path: path.resolve(__dirname, 'dist'), filename: "bundle.js" }, module: { rules: [ { test: /\.js$/, exclude: /node_modules/, use: { loader: 'babel-loader', options: { presets: ['env', 'es2015', 'stage-2'] } } } ] }, /*plugins: [ new HtmlWebpackPlugin({ title: 'Project Demo', hash: true, template: './views/index.ejs' // Load a custom template (ejs by default see the FAQ for details) }) ],*/ node: { __dirname: false }, target: 'node' }); const watchConfig = { // compiler watch configuration // see https://webpack.js.org/configuration/watch/ aggregateTimeout: 300, poll: 1000 }; let serverControl; compiler.watch(watchConfig, (err, stats) => { if (err) { console.error(err.stack || err); if (err.details) { console.error(err.details); } return; } const info = stats.toJson(); if (stats.hasErrors()) { info.errors.forEach(message => console.log(message)); return; } if (stats.hasWarnings()) { info.warnings.forEach(message => console.log(message)); } if (serverControl) { serverControl.kill(); } // change filename to the relative path to the bundle created by webpack, if necessary(choose what to run) serverControl = spawn('node', [path.resolve(__dirname, 'dist/bundle.js')]); serverControl.stdout.on('data', data => console.log(data.toString())); serverControl.stderr.on('data', data => console.error(data.toString())); });
about 4 years ago · Santiago Trujillo
1 Respuestas
Responde la pregunta

0

Excelente pregunta: la resolví de la siguiente manera:

express tiene dos módulos que puedes instalar para refrescar en caliente sin refrescar el navegador, y se refrescará automáticamente: te dejo mi configuración.

npm i livereload

npm me conecto-livereload

 const livereload = require('livereload'); const connectLivereload = require('connect-livereload'); const liveReloadServer = livereload.createServer(); liveReloadServer.watch(path.join(__dirname, '..', 'dist', 'frontend')); const app = express(); app.use(connectLivereload());

ingrese la descripción de la imagen aquí

Tenga en cuenta que la carpeta que desea monitorear está en dist/frontend. Cambia la carpeta que quieres monitorear para que funcione: Para monitorear el backend estoy usando NODEMON

livereload abre un puerto para el navegador en el backend para exponer los cambios: ¿cómo ocurre la conexión? Es fácil; express con " connect-livereload " e inyecte un script que monitorea ese puerto: si ocurre un cambio, express notifica al navegador y el navegador se actualizará por usted .

Dejo la información lo más simple posible para probar, y no recomiendo usarla así: Para usarla debes separar los ambientes de desarrollo y producción. Lo mantengo simple para que sea fácil de entender.

Aquí les dejo el link más relevante que encontré: Espero que les sea de ayuda también.

https://bytearcher.com/articles/refresh-changes-browser-express-livereload-nodemon/

about 4 years ago · Santiago Trujillo Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda