我在我的网站上使用BrowserSync。以下实时重新加载了我的CSS更改,但它在http://localhost:3000/处打开了一个网页
gulp.task('sass-watch', ['theme-css'], browserSync.reload);
gulp.task('browser-sync', function() {
var files = [
'htdocs/themes/custom/my-theme/dist/*'
];
browserSync.init(files,{
proxy: 'mysite.com'
});
});
我的网站是通过Vagrant配置的,可以在mysite.com上进行本地访问。如何使BrowserSync在此自定义URL上运行?
我的虚拟机正在使用端口80时,我尝试了以下操作。
gulp.task('browser-sync', function() {
var files = [
'htdocs/themes/custom/my-theme/dist/*'
];
browserSync.init(files,{
open: 'external',
host: 'mysite.com',
proxy: 'mysite.com',
port: 80
});
});
但是我得到一个错误:
events.js:141
throw er; // Unhandled 'error' event
^
Error: listen EACCES 0.0.0.0:80
at Object.exports._errnoException (util.js:874:11)
at exports._exceptionWithHostPort (util.js:897:20)
at Server._listen2 (net.js:1221:19)
at listen (net.js:1270:10)
at Server.listen (net.js:1366:5)
at module.exports.plugin (/path-to-my-site/node_modules/browser-sync/lib/server/index.js:24:25)
at Object.module.exports.startServer [as fn] (/path-to-my-site/node_modules/browser-sync/lib/async.js:236:52)
at /path-to-my-site/node_modules/browser-sync/lib/browser-sync.js:149:14
at iterate (/path-to-my-site/node_modules/browser-sync/node_modules/async-each-series/index.js:8:5)
at /path-to-my-site/node_modules/browser-sync/node_modules/async-each-series/index.js:16:16
如果我使用默认端口3000,则页面会加载,但是我收到错误连接被拒绝。
ERR_CONNECTION_REFUSED
最佳答案
您的第一次尝试是正确的尝试,当然,这样一来,您将获得browserSync在http://localhost:3000上为您的应用程序提供服务,这是默认设置。
第二个没有什么错,只是您要分配给browserSync的地址已经由vagrant使用。
因此,如果您希望browserSync在mysite.com上,则应将vagrant配置为采用其他方式。
如果这样做,脚本将变为:
gulp.task('browser-sync', function() {
var files = [
'htdocs/themes/custom/my-theme/dist/*'
];
browserSync.init(files,{
open: 'external',
host: 'mysite.com',
proxy: 'mylaravel.com',
port: 80
});
});
关于gulp - 带自定义URL的BrowserSync,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/36012868/