Question

我正在本地安装wordpress。

更改CSS文件后，浏览器将正确显示它们。但是，PHP文件中的任何更改都会将样式恢复到CSS上一次更改之前的状态，从而迫使我返回到任何CSS文件以再次保存它，从而使我能够正确地观察到这两个更改。

编辑：每次我对PHP文件进行更改时，终端都会在最后一条消息中显示“正在重新加载浏览器...”，而CSS任务似乎每次都在开始和结束。在Gulp文档中，我发现了以下内容：'未提供错误或警告消息，因为文件监视程序使Node进程保持运行状态。由于该过程没有退出，因此无法确定是完成任务还是仅花费很长时间才能运行。 “警告：避免同步”标题下，但我不知道这是否与我的问题有关。

编辑2：我的问题似乎在Chrome中仍然存在。但是，在Firefox中，这种行为是预期的。我在Chrome中使用禁用的缓存。

我正在使用一个非常简单的gulpfile.js文件。

const gulp = require('gulp'); 
const browsersync = require('browser-sync').create(); 
const postcss = require('gulp-postcss'); 
const cssImport = require('postcss-import'); 
const postcssVariables = require('postcss-simple-vars'); 
const autoprefixer = require('autoprefixer'); 
const { series, parallel } = require('gulp'); 

const stylePath = "./wordpress/wp-content/themes/Produccion/styleFolders/style.css"; 
const styleDest = "./wordpress/wp-content/themes/Produccion/"; 

// BrowserSync function
function browserSync(done) {
  browsersync.init({
    proxy: 'localhost/Produccion/wordpress',
    notify: false
  }); 
  done(); 
}

// Reload function
function reload(done) {
  browsersync.reload(); 
  done(); 
}

function css() {
  return gulp.src(stylePath)
  .pipe(postcss([cssImport, postcssVariables, autoprefixer]))
  .pipe(gulp.dest(styleDest))
  .pipe(browsersync.stream()); 
}

function watchFiles(done) {
  gulp.watch("./wordpress/wp-content/themes/Produccion/styleFolders/**/*.css", css);
  gulp.watch("./wordpress/wp-content/themes/Produccion/**/*.php", reload);
  done(); 
}

const build = gulp.series(browserSync, watchFiles); 
exports.default = build;

在Wordpress中更改PHP后，BrowserSync将不会显示新样式

0 个答案: