Menu
  • HOME
  • TAGS

Gulp browser-sync proxy

proxy,gulp,browser-sync

According to the docs you should be using target rather than host. proxy: { target: "http://yourlocal.dev" } Or simply proxy: "local.dev" like @niba has in his answer...

'grunt serve' starts fine but never loads

gruntjs,jhipster,browser-sync

D'oh I was under the mistaken assumption that 'grunt serve' did the same thing (only better) as "mvn spring-boot:run". Not so. "mvn spring-boot:run" runs the backend web server and handles the REST endpoints. 'grunt serve' handles the front end angularJS side of things. Looking back at the documentation it is...

How to filter a gulp watch, which watches for CSS changes, in order to let browserSync stream only the actual modified files

gulp,browser-sync

You can invoke gulp.watch() with a glob and callback and use the event passed to the callback to know exactly which css file changed. gulp.watch(basePath+'/css/**/*.css', function(event) { gulp.src(event.path, {read: false}) .pipe(browserSync.stream()); }); After changing your watch to this, the css task in your example wouldn't be needed....

npm install error not installing BrowserSync package

node.js,cmd,npm,command-prompt,browser-sync

Have you tried like below? (http://www.browsersync.io/#install) npm install -g browser-sync -g means global. ...

BrowserSync reload doesn't work (wordpress site)

node.js,wordpress,gulp,browser-sync

You're telling browser-sync to reload only your minified css version. You probably use non-minified version in your page and that causes the problem. So either reload just non-minified: .pipe(gulp.dest(css)) .pipe(reload({stream: true})) .pipe(rename({ suffix: '_min' })) .pipe(minifyCSS({keepSpecialComments:0})) .pipe(gulp.dest(css)); or both: .pipe(gulp.dest(css)) .pipe(reload({stream: true})) .pipe(rename({ suffix: '_min' })) .pipe(minifyCSS({keepSpecialComments:0})) .pipe(gulp.dest(css)) .pipe(reload({stream: true}));...

browser-sync does not refresh page after changes with Gulp

sass,gulp,browser-sync

This is because you're calling browserSync.reload on the html watch and not on the scss watch. Try this: gulp.watch("app/scss/*.scss", ['sass']).on('change', browserSync.reload); gulp.watch("app/*.html").on('change', browserSync.reload); ...

browser-sync is blocked by chrome csp

google-chrome,gulp,content-security-policy,browser-sync

Not sure if it's the best solution, but what i ended up doing is to install a chrome plugin that disables the csp: https://chrome.google.com/webstore/detail/disable-content-security/ieelmcmcagommplceebfedjlakkhpden If anyone has a better solution i'll be glad to hear it....

How to make BrowserSync work with an nginx proxy server?

nginx,proxy,gulp,same-origin-policy,browser-sync

To get more control over how opening the page is done, use opn instead of browser sync's mechanism. Something like this (in JS - sorry, my Coffee Script is a bit rusty): browserSync({ server: { // ... }, open: false, port: 3001 }, function (err, bs) { // bs.options.url contains...

How to configure port in browser-sync

node.js,gulp,browser-sync

Answer based on the documentation links (link1, link2). You are using browser-sync version 2.0+, they have a different recommended syntax. Using that syntax your code could be like this: // require the module as normal var bs = require("browser-sync").create(); .... gulp.task('serve', [], function() { // .init starts the server bs.init({...

Multiple erros in jquery-2.1.0.min.js and browser-sync-client.1.7.1.js

jquery,node.js,gulp,browser-sync

The stack trace shows it's coming from fb.setDocument. Perhaps its facebook?

Gulp.js serve src files WITHOUT browserSync?

javascript,node.js,gulp,gulp-watch,browser-sync

Here's how to deprecate BrowserSync in favor of gulp-connect, a simple and stable Gulp plugin to run a webserver (with LiveReload). New gulp/server.js: 'use strict'; var gulp = require('gulp'); var util = require('util'); var connect = require('gulp-connect'); module.exports = function(options) { function createServerTask(name, pre, root) { gulp.task(name, pre, function() {...

Browser sync reloading but CSS not changing with LESS and Gulp

less,gulp,browser-sync

A good way to make browserSync work that way is to have a new listener on to the generated files. You compile LESS to CSS, gulp.task('less', function(){ return gulp.src(basepath + 'styles/emma.less') .pipe(plumber()) .pipe(sourcemaps.init()) .pipe(less()) .pipe(autoprefixer({ browsers: ['last 2 versions'] })) .pipe(minifyCSS()) .pipe(sourcemaps.write('./')) .pipe(filesize()) .pipe(gulp.dest( paths.dest + '/css' )); }); and...

BrowserSync showing message 'Disconnected from BrowserSync'

gulp,gulp-watch,browser-sync

It looks like he just fixed whatever the bug was in 2.7.1. Updating Browser-sync fixed the issue for me :)

Excluding files for BrowserSync not working

node.js,npm,gulp,browser-sync

I found a solution to my problem. It was actually crashing because of my path declaration. This is what I had before: var client = './src/client/'; var clientApp = client + 'app/'; var server = './src/server/'; var bower = './bower_components/'; var tmp = './.tmp/'; As you can see each path...

Why browser-sync is not working with moodle theme

javascript,node.js,moodle,browser-sync

I do apology for posting the answer of my own question. Usually, in moodle we have listed out the css files in config.php. After created new css and listed this into config.php does not work. So I did attach the new css file into head tag with link tag, something...

Gulp-webapp running BrowserSync and PHP

php,sass,workflow,gulp,browser-sync

FWIW, I've got a quite simple and fair solution for that by placing the compiled .css file in the app/ root and moving /bower_dependencies folder inside the app/ folder. For Sass, I only needed to change the path in the placeholder to <!-- build:css styles/main.css --> and change the dest...

command line browser-sync detects changes, doesn't refresh page

node.js,browser-sync

I had prefixfree.js included, so it rewrites the css and prevents BS from working.

Error handling with gulp-ruby-sass 1.0.0-alpha, gulp-notify, and browser-sync

error-handling,gulp,browser-sync,gulp-notify

The solution I found was to wrap notify.onError in an anonymous function and append this.emit('end'): .on('error', function(err) { notify.onError({ title: 'Error!', message: '<%= error.message %>', sound: 'Beep' })(err); this.emit('end'); }) ...

Browser-sync (under gulp) doesn't refresh browser

javascript,gulp,gulp-watch,gulp-livereload,browser-sync

I figured it out: browser-sync doesn't like implicit html tags, so this (although valid HTML5) will not work: <!doctype html> <title>implicit</title> but this will: <!doctype html> <html> <head> <title>full doc</title> </head> <body></body> </html> ...

How to make requests to a local Rails app from a local AngularJS app running on a different port?

ruby-on-rails,angularjs,localhost,cors,browser-sync

Ah, wonderful. Here are a few solutions: set up CORS, which shouldn't be too hard. All you have to do is add the headers to pages serving your static content (not the rails REST endpoints), The problem with this is you shouldn't really be doing it unless you have a...

How to do remote debugging with Browser-sync?

remote-debugging,browser-sync

Though this was quite a tricky process in versions before Browser-sync 2.0, but with Browser-sync 2.0 you now have a brand new Web UI, which makes this process a whole lot easier. Firstly you need to update Browser-sync to it's latest version npm install -g [email protected] Then run any command...

gulp + browser-sync - why gulp errors on removing directory from app?

gulp,gulp-watch,browser-sync

The problem here was an outdated version of BrowserSync. Updating to the latest version will solve this issue....

Unsure about example given on BrowserSync homepage

javascript,gulp,browser-sync

Yes, according to the documentation, that's a possibility. Off that same page... (make sure you return the stream from your tasks to ensure the browser is reloaded at the correct time) If it's an async task it will just fire and not return anything, and the watcher will not know...

Browsersync doesn't set the right local url

wordpress,browser-sync

Issue solved thanks to bower community member (github issue) I just need to delete any configuration option and add the snippet below before the closing tag: <script type='text/javascript' id="__bs_script__">//<![CDATA[ document.write("<script async src='//HOST:3000/browser-sync/browser-sync-client.2.1.0.js'><\/script>".replace(/HOST/g, location.hostname).replace(/PORT/g, location.port)); //]]></script> ...

Gulp browser-sync where place folder?

javascript,gulp,browser-sync

I believe this is because Browser sync does not know, without additional configuration, what to do when you do not specify the explicit file you want to view. Normally, web servers default to viewing index.html when a directory is specified. To see if this is the case, go to http://localhost:3000/index.html,...