[英]Express combined with browser-sync with node
我对JavaScript世界很陌生,我想第一次构建我的开发环境我想要实现的应该是简单的......
我想运行一个Express服务器以及浏览器同步进行热重新加载我没有使用gulp或grunt
但我一直收到这个错误:
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-sync中间件在不同的端口上运行它们。
这是我的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') + '...');
});
在端口3000上有一个Express服务器(没有页面自动重新加载)。 在端口3001上,BrowserSync服务器通过页面自动重新加载提供相同的内容。
我不知道为什么但没有npm-run-all
浏览器同步自动将端口移动到3001.在我尝试使用npm-run-all
它似乎没有自动移动端口。 所以我认为你必须像这样指定它:
"browser-sync": "browser-sync start--proxy=localhost:3000 --port=3001 --files=views"
或者至少那对我有用:)
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.