使用browserSync不起作用的解决办法

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/q36835109/article/details/78677637

记录一下使用browserSync所踩的坑。。


全局安装browserSync

npm install -g browser-sync

局部安装browserSync

npm install browser-sync --save-dev


1.静态服务器

运行命令

browser-sync start --server "D:/phpstudy/PHPTutorial/WWW" --files "**"

注:

--server 后面带绝对路径地址,相对路径找不到文件。

--files 必须带上,不带上修改文件不会刷新


browsersync + gulp.js

gulp.task('run', function() {
    browserSync.init({
        server: {
            baseDir: "D:/phpstudy/PHPTutorial/WWW"
        },
		files:['**'],
		notify: false,      //禁用浏览器的通知元素
		port:3002
    });
});

注:

baseDir 后面带绝对路径地址,相对路径找不到文件。

files 必须带上不带上修改文件不会刷新


2.代理服务器
运行命令

browser-sync start --proxy "localhost:3000" --files "**"
注:

--proxy 地址写上端口号,如果默认80那就不需要写.

--files 必须带上不带上修改文件不会刷新


browsersync + gulp.js

gulp.task('start', function() {
	browserSync.init({
		proxy: 'http://localhost:3000',
		files: ['**'],
		port: 3001,
		notify: false,      //禁用浏览器的通知元素
		browser: "chrome"
	});
});

注:

proxy 地址写上端口号,如果默认80那就不需要写.

files 必须带上,不带上修改文件不会刷新






猜你喜欢

转载自blog.csdn.net/q36835109/article/details/78677637