当前位置: 首页 > 知识库问答 >
问题:

没有SCSS的Browsersync?

汪信鸥
2023-03-14

我是gulp的新手,我正在尝试设置没有SCSS的browsersync。我所看到的所有示例都为预处理sass设置了它。我如何设置它观看普通的CSS?这是我的gulpfile.js:

const gulp = require('gulp'),
browserSync = require('browser-sync').create(),
sass = require('gulp-sass');


// Static server & watch scss + html files
gulp.task('watch', ['sass'], function() {

browserSync.init({
server: '.'
});

gulp.watch('./assets/**/*.scss', ['sass'], browserSync.reload);
gulp.watch('./*.html').on('change', browserSync.reload);
gulp.watch('./js/**/*.js', browserSync.reload);

});

// Compile Sass into CSS & inject into browsers
gulp.task('sass', function() {
return gulp.src('./assets/**/*.scss')
.pipe(sass().on('error', sass.logError))
.pipe(gulp.dest('./css'))
.pipe(browserSync.stream());
});


// default will also watch
gulp.task('default', ['watch']);

共有1个答案

王子明
2023-03-14

试试这段代码。对我起作用了。不过,我不认为sass=require('gulp-sass')是必要的。

const gulp = require('gulp'),
browserSync = require('browser-sync').create(),
sass = require('gulp-sass');


// Static server & watch scss + html files
gulp.task('watch', function() {

browserSync.init({
server: '.'
});

gulp.watch('./assets/*.css', browserSync.reload);
gulp.watch('./*.html').on('change', browserSync.reload);
gulp.watch('./js/*.js', browserSync.reload);

});


// default will also watch
gulp.task('default', ['watch']);
 类似资料:
  • 下面是我的整个: 将感谢帮助调试这个。

  • 本文向大家介绍sass SCSS,包括了sass SCSS的使用技巧和注意事项,需要的朋友参考一下 示例 就像在Sass中一样,SCSS变量用于存储一个值,该值将在整个SCSS文档中多次使用。 变量通常用于存储常用的属性值(例如字体和颜色),但可以用于任何属性的任何值。 SCSS使用该$符号声明变量。 !default如果要仅在尚未分配新值的情况下为该变量分配新值,则可以在声明变量时使用:    

  • 本文向大家介绍Scss和Sass有什么区别?相关面试题,主要包含被问及Scss和Sass有什么区别?时的应答技巧和注意事项,需要的朋友参考一下 编写语法不同,sass 他是按照缩进式写法 1、sass 不带大括号, scss 带大括号 2、 sass 没有 ; 号 , scss有 3、 scss 写法和css 简直一样

  • 这是我想要得到的输出: 代码如下:https://jsfiddle.net/t5ewp8ax/ 似乎台词: 被正确解析为

  • gulp-scss-starter �� Особенности именование классов по БЭМ используется БЭМ-структура используется препроцессор SCSS используется транспайлер Babel для поддержки современного JavaScript (ES6) в браузе

  • Styling Cross-Browser Compatible Range Inputs with Sass / SCSS Sass component for customizing the input range using the native properties of each browser. Based on article Styling Cross-Browser Compat