Javascript Express结合浏览器与节点同步
我对JavaScript的世界非常陌生,我第一次尝试构建我的开发环境,我想要实现的应该是简单的 我想运行一个快速服务器与浏览器同步热重新加载我没有使用咕噜或咕噜 但我一直在犯这样的错误:Javascript Express结合浏览器与节点同步,javascript,node.js,express,automation,browser-sync,Javascript,Node.js,Express,Automation,Browser Sync,我对JavaScript的世界非常陌生,我第一次尝试构建我的开发环境,我想要实现的应该是简单的 我想运行一个快速服务器与浏览器同步热重新加载我没有使用咕噜或咕噜 但我一直在犯这样的错误: Starting the application in the development mode... [BS] Proxying: http://localhost:3000 [BS] Access URLs: ------------------------------------ Local:
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
这就是我的脚本在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"
},
在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)
}
});
在bs config.js
文件中,我刚刚将ui更改为false
给了我使用代理的提示,但我仍然收到错误,我不知道为什么…请告诉我,我想了解出了什么问题该错误意味着您已经在端口3000上运行了一些东西。可能是同一项目的另一个实例在不同的窗口中运行。:) 我也面临类似的问题。看起来BrowserSync不再在同一端口上使用Express。我使用connect browser同步中间件在不同的端口上运行了这两个程序 这是我的服务器.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') + '...');
});
在端口3000上有一个Express服务器(没有页面自动重新加载)。在端口3001上有一个BrowserSync服务器,它通过页面自动重新加载来提供相同的内容。我不知道为什么,但如果没有
npm run all,
browser sync会自动将端口移到3001。在我尝试使用npm run all
之后,它似乎没有自动移动端口。因此,我认为您必须这样指定:
“浏览器同步”:“浏览器同步开始--代理=本地主机:3000--端口=3001--文件=视图”
或者至少这对我有效:)我已经杀死了节点的所有实例,并再次尝试。我得到的是浏览器上的无限加载和控制台上的错误。。。顺便说一句,将express和浏览器同步放在一起是否符合我的逻辑?吸引我使用浏览器同步的是,即使在共享时,也能保持热重新加载功能。还有其他选择吗?它终于起作用了!但是它在另一个端口上,所以现在我打开了两个选项卡,一个在3000上,另一个在3001上。如何在同一个端口上获得这两个选项卡?