Use BrowserSync as proxy with serving local files.
Last active
December 13, 2015 17:14
-
-
Save reepush/5d9bb62112b4bf183926 to your computer and use it in GitHub Desktop.
Proxify assets with BrowserSync
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
html { | |
background-color: #fafafa; | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
var angle = 0 | |
var logo = document.querySelector('.home-logo') | |
setInterval(function() { | |
angle = (angle + 20) % 360 | |
logo.style.transform = 'rotate(' + angle + 'deg)' | |
}, 100) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
var gulp = require('gulp'), | |
bs = require('browser-sync').create() | |
gulp.task('browser-sync', function() { | |
bs.init({ | |
proxy: { | |
target: 'https://www.yandex.ru/', | |
proxyRes: [function(res, req) { | |
// Remove content-security-policy header | |
// to allow BrowserSync connections. | |
delete res.headers['content-security-policy'] | |
}] | |
}, | |
port: 3000, | |
serveStatic: ['./'], | |
rewriteRules: [ | |
{ | |
match: /<\/body>/, | |
fn: function() { | |
return '<script src="/custom.js"></script>\n' | |
} | |
}, | |
{ | |
match: /<\/head>/, | |
fn: function() { | |
return '<link rel="stylesheet" href="/custom.css">\n' | |
} | |
} | |
] | |
}) | |
}) | |
gulp.task('default', ['browser-sync'], function() { | |
gulp.watch('custom.js', bs.reload) | |
// We need to tell BrowserSync that stylesheet was changed | |
// for injection without page reloading. | |
gulp.watch('custom.css', bs.reload.bind(null, 'custom.css')) | |
}) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
{ | |
"private": "true", | |
"dependencies": { | |
"browser-sync": "^2.10.0", | |
"gulp": "^3.9.0" | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment