Skip to content
This repository was archived by the owner on Jun 25, 2025. It is now read-only.

Inject css styles instead of reloading page for local server #781

Open
Nibblesh wants to merge 6 commits into
base: master
Choose a base branch
from
Open

Inject css styles instead of reloading page for local server #781

Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
6b2a181
Inject css styles instead of reloading page for local server
Nov 15, 2015
63c1dc6
remove styles script from array in watch
Nov 16, 2015
7aab6b4
added conditional check to see if browsersync is active before inject…
Feb 8, 2016
c48d5b8
browsersync typo
Feb 8, 2016
409bf37
changed browserSync instance to manually created to work with browser…
Feb 8, 2016
1f3e58c
updated serve:dist to call init
Feb 8, 2016
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 7 additions & 5 deletions gulpfile.babel.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -29,12 +29,13 @@ import path from 'path';
import gulp from 'gulp';
import del from 'del';
import runSequence from 'run-sequence';
import browserSync from 'browser-sync';
import bs from 'browser-sync';
import swPrecache from 'sw-precache';
import gulpLoadPlugins from 'gulp-load-plugins';
import {output as pagespeed} from 'psi';
import pkg from './package.json';

const browserSync = bs.create()
const $ = gulpLoadPlugins();
const reload = browserSync.reload;

Expand Down Expand Up @@ -99,7 +100,8 @@ gulp.task('styles', () => {
.pipe($.if('*.css', $.minifyCss()))
.pipe($.size({title: 'styles'}))
.pipe($.sourcemaps.write('./'))
.pipe(gulp.dest('dist/styles'));
.pipe(gulp.dest('dist/styles'))
.pipe($.if(browserSync.active, browserSync.stream({ match: '**/*.css' })));
});

// Concatenate and minify JavaScript. Optionally transpiles ES2015 code to ES5.
Expand Down Expand Up @@ -160,7 +162,7 @@ gulp.task('clean', cb => del(['.tmp', 'dist/*', '!dist/.git'], {dot: true}));

// Watch files for changes & reload
gulp.task('serve', ['scripts', 'styles'], () => {
browserSync({
browserSync.init({
notify: false,
// Customize the Browsersync console logging prefix
logPrefix: 'WSK',
Expand All @@ -175,14 +177,14 @@ gulp.task('serve', ['scripts', 'styles'], () => {
});

gulp.watch(['app/**/*.html'], reload);
gulp.watch(['app/styles/**/*.{scss,css}'], ['styles', reload]);
gulp.watch(['app/styles/**/*.{scss,css}'], 'styles');
gulp.watch(['app/scripts/**/*.js'], ['lint', 'scripts']);
gulp.watch(['app/images/**/*'], reload);
});

// Build and serve the output from the dist build
gulp.task('serve:dist', ['default'], () =>
browserSync({
browserSync.init({
notify: false,
logPrefix: 'WSK',
// Allow scroll syncing across breakpoints
Expand Down