Answer the question
In order to leave comments, you need to log in
How to set up BrowserSync in Gulp that proxy Flask?
var browserSync = require("browser-sync").create();
var paths = {
styles: {
src: "static/sass/style.scss",
dest: "static/css"
}
}
function reload() {
browserSync.reload();
}
function style() {
return (
gulp
.src(paths.styles.src)
// Initialize sourcemaps before compilation starts
.pipe(sourcemaps.init())
.pipe(sass())
.on("error", sass.logError)
// Use postcss with autoprefixer and compress the compiled file using cssnano
.pipe(postcss([autoprefixer(), cssnano()]))
// Now add/write the sourcemaps
.pipe(sourcemaps.write())
.pipe(gulp.dest(paths.styles.dest))
.pipe(browserSync.stream())
);
reload();
}
function watch() {
browserSync.init({
// You can tell browserSync to use this directory and serve it as a mini-server
proxy: "127.0.0.1:5003"
// If you are already serving your website locally using something like apache
// You can use the proxy setting to proxy that instead
// proxy: "yourlocal.dev"
});
gulp.watch("static/sass/*.scss", style);
gulp.watch("templates/*.html", reload);
}
var gulp = require("gulp"),
sass = require("gulp-sass"),
postcss = require("gulp-postcss"),
autoprefixer = require("autoprefixer"),
cssnano = require("cssnano"),
sourcemaps = require("gulp-sourcemaps");
exports.watch = watch;
exports.style = style;
Answer the question
In order to leave comments, you need to log in
Didn't find what you were looking for?
Ask your questionAsk a Question
731 491 924 answers to any question