browserSync 停止注入 css

问题描述

我已经使用这个 gulp 文件几个月了,没有任何问题。但出乎意料的是,它停止在我所有的项目中注入 css。

我尝试重新安装所有软件包,但没有任何变化。我怎样才能找出造成这种情况的原因?

import { src,dest,watch,series,parallel } from 'gulp';
import yargs from 'yargs';
import sass from 'gulp-sass';
import cleanCss from 'gulp-clean-css';
import gulpif from 'gulp-if';
import postcss from 'gulp-postcss';
import sourcemaps from 'gulp-sourcemaps';
import autoprefixer from 'autoprefixer';
import del from 'del';
import webpack from 'webpack-stream';
import named from 'vinyl-named';
import browserSync from 'browser-sync';
import info from './package.json';

const PRODUCTION = yargs.argv.prod;
const server = browserSync.create();


// Live load and reload changes
export const serve = done => {
  server.init({
    port: 3000,server: true
  });
  done();
};

export const reload = done => {
  server.reload();
  done();
};


// Clean dist folder
export const clean = () => del(['dist']);


// Bundle styles
export const styles = () => {
  return src(['src/scss/main.scss'])
  .pipe(gulpif(!PRODUCTION,sourcemaps.init()))
  .pipe(sass().on('error',sass.logError))
  .pipe(gulpif(PRODUCTION,postcss([ autoprefixer ])))
  .pipe(gulpif(PRODUCTION,cleanCss({compatibility:'ie8'})))
  .pipe(gulpif(!PRODUCTION,sourcemaps.write()))
  .pipe(dest('dist/css'))
  .pipe(browserSync.stream());
}


// copy new folders to dist
export const copy = () => {
  return src(['src/**/*','!src/{images,js,scss}',scss}/**/*'])
  .pipe(dest('dist'));
}


// Bundle scripts
export const scripts = () => {
...
}


// Watch for changes
export const watchForChanges = () => {
  watch('src/scss/**/*.scss',styles);
  watch('src/images/**/*.{jpg,jpeg,png,svg,gif}',series( reload));
  watch(['src/**/*','!src/{js,scss}/**/*'],series(copy,reload));
  watch('src/js/**/*.js',series(scripts,reload));
  watch('**/*.PHP',reload);
  watch('**/*.html',reload);
}


// Tasks
export const dev = series(clean,parallel(styles,copy,scripts),serve,watchForChanges);
export const build = series(clean,scripts));
export default dev;

CSS get 是这样加载的: <link rel="stylesheet" type="text/css" href="dist/css/main.css">

终端输出: 23:11:38 开始“风格”... 23:11:38 33 毫秒后完成“样式”

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)