Express a combiné avec synchronisation du navigateur avec le noeud

Question

Je suis très nouveau dans le monde de JavaScript et je suis en train de construire mon environnement de développement pour la première fois ce que je veux réaliser doit être simple ...

Je veux pour exécuter un serveur express avec synchronisation du navigateur pour le rechargement à chaud je ne suis pas en utilisant gulp ou grognement

mais je continue à obtenir cette erreur:

Starting the application in the development mode... 
[BS] Proxying: http://localhost:3000 
[BS] Access URLs: 
------------------------------------ 
    Local: http://localhost:3000 
External: http://10.111.234.196:3000 
------------------------------------ 
[BS] Watching files... 
events.js:160 
     throw er; // Unhandled 'error' event 
    ^

Error: listen EADDRINUSE :::3000 

c'est ce que mes mes scripts ressemblent dans le fichier package.jason

"scripts": { 
"prestart": "babel-node buildScripts/startMessage.js", 
"start": "npm-run-all --parallel security-check open:src", 
"open:src": "babel-node buildScripts/srcServer.js & browser-sync start --proxy 'localhost:3000' --files 'src' --no-ui", 
"security-check": "nsp check" 
}, 

dans le srcServer.js:

import express from 'express'; 
import path from 'path'; 
import open from 'open'; 

const port = 3000; 
const app = express(); 


app.get('/', function(request, response){ 
response.sendFile(path.join(__dirname, '../src/index.html')); 
}); 

app.listen(port, function(err){ 
if(err){ 
console.log(err); 
}else{ 
open('http://localhost:'+ port) 
} 
}); 

et dans le fichier bs-config.js est la valeur par défaut que je viens de changer uipour false

This question m'a donné l'indication d'utiliser le proxy mais je reçois encore que erreur que je ne sais pas pourquoi ... s'il vous plaît éclairer moi je veux comprendre ce qui ne va pas

Answer 1

Cette erreur signifie que vous avez déjà quelque chose runnin g sur le port 3000. Probablement une autre instance du même projet s'exécutant dans une fenêtre différente. :)

Answer 2

J'ai fait face au même problème. On dirait que BrowserSync ne fonctionne plus avec Express sur le même port. J'ai réussi à les exécuter tous les deux sur différents ports avec le middleware connect-browser-sync.

Il est mon server.js:

var express = require('express'), 
    bodyParser = require('body-parser'), 
    http = require('http'), 
    path = require('path'), 
    cors = require('cors'); 


// Express server 
var app = module.exports = express(); 
app.set('port', process.env.PORT || 3000); 


// BrowserSync at development host 
if (app.get('env') === 'development') { 
    var browserSync = require('browser-sync'), 
    var bsconf = { 
     host: 'localhost', 
     port: 3001, 
     https: false, 
     notify: false, 
     open: false, 
     online: false, 
     ui: false, 
     server: { 
      baseDir: path.join(__dirname, '/public') 
     }, 
     files: [path.join(__dirname, '/public/**/*.{html,css,js,json}')] 
    }; 
    var bs = browserSync.create().init(bsconf); 

    app.use(require('connect-browser-sync')(bs)); 
} 

app.use(bodyParser.json()); 
app.use(bodyParser.urlencoded({ extended: true })); 
app.use(express.static(path.join(__dirname, 'public'))); 
app.use(cors()); 


// Route index.html 
app.get('/', function(req, res) { 
    res.sendFile(path.join(__dirname, 'public', 'index.html')); 
}); 


// Starting express server 
http.createServer(app).listen(app.get('port'), function() { 
    console.log('Listening on port ' + app.get('port') + '...'); 
}); 

Sur le port 3000 il y a un serveur Express (sans rechargement de la page auto). Et sur le port 3001, le serveur BrowserSync sert le même contenu avec le rechargement automatique de la page.