如何解决浏览器同步重新加载在 Wordpress 网站上不起作用
我无法在 wordpress 网站上使用浏览器同步的更改时重新加载功能。
我在我的 Gulpfile 中调用浏览器同步重新加载,如下所示。 Gulpfile 所做的是创建一个任务来观察所有 sass 和 js 文件,并将它们缩小/发送到目录 /dist
。
运行 Gulp 成功启动站点,但不会在文件更改时重新加载。我没有收到来自 gulp 的任何错误 - 这是 gulp 的输出:
$ gulp
[16:14:52] Using gulpfile ~\my-site\wp-content\themes\XXXX\gulpfile.js
[16:14:52] Starting 'default'...
[16:14:52] Starting 'browserSync'...
[Browsersync] Proxying: http://localhost
[Browsersync] Access URLs:
----------------------------------
Local: http://localhost:8000
External: http://192.168.95.1:8000
----------------------------------
[Browsersync] Watching files...
[Browsersync] Reloading Browsers...
[Browsersync] Reloading Browsers...
(请注意,出于隐私考虑,实际的 Gulpfile 路径已被编辑。)
这是我的 Gulpfile:
/* file: gulpfile.js */
var gulp = require('gulp');
var sass = require('gulp-sass');
const minify = require('gulp-minify');
var concat = require('gulp-concat');
var browserSync = require('browser-sync').create(),// Asynchronous browser loading on .scss file changes
reload = browserSync.reload;
gulp.task('sass',function(){
return gulp.src('sass/**/*.scss')
.pipe(sass()) // Using gulp-sass
.pipe(gulp.dest('dist/'))
.pipe(minify({
ext: '.css',mangle: false,noSource: true
}))
.pipe(browserSync.reload({stream:true}));
});
gulp.task('compress',function() {
return gulp.src('js/*.js')
.pipe(concat('main.js'))
.pipe(minify({
ext: '.js',noSource: true
}))
.pipe(gulp.dest('dist/scripts'));
});
gulp.task('browserSync',function(){
browserSync.init({
proxy: 'localhost',port: '8000',ui: false,files: [
"sass/**/*.scss","*.php","js/*.js"
]
});
});
gulp.task('default',gulp.series('browserSync',function(){
gulp.watch('sass/**/*.scss',gulp.series(['sass']));
gulp.watch('js/*.js',gulp.series(['compress']));
browserSync.reload;
}));
npm:6.4.1
吞咽:
CLI 版本:2.3.0
本地版本:4.0.2
浏览器同步:2.26.14
我的开发服务器运行在 localhost:8000,使用 php 服务器。
让我知道是否需要澄清...
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。