You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: README.md
+20-21Lines changed: 20 additions & 21 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -4,11 +4,11 @@
4
4
5
5
Follow [@browserSync](http://www.twitter.com/browserSync) for news & updates.
6
6
7
-
##About
7
+
##About
8
8
9
9
For a full list of features, please visit [https://github.com/shakyShane/browser-sync](https://github.com/shakyShane/browser-sync)
10
10
11
-
##Usage
11
+
##Usage
12
12
13
13
First, install `browser-sync` as a development dependency:
14
14
@@ -25,39 +25,38 @@ var browserSync = require('browser-sync');
25
25
// Static server
26
26
gulp.task('browser-sync', function() {
27
27
browserSync.init(null, {
28
-
server: {
29
-
baseDir:"./"
30
-
}
28
+
server: {
29
+
baseDir:"./"
30
+
}
31
31
});
32
32
});
33
33
34
-
35
34
// or...
36
35
37
-
38
36
// Proxy to existing vhost (version 0.7.0 & greater)
39
37
gulp.task('browser-sync', function() {
40
38
browserSync.init(null, {
41
-
proxy:"yourlocal.dev"
39
+
proxy:"yourlocal.dev"
42
40
});
43
41
});
44
42
45
43
// Proxy to existing vhost (before version 0.7.0) * Seriously? time to upgrade.
46
44
gulp.task('browser-sync', function() {
47
45
browserSync.init(null, {
48
-
proxy: {
49
-
host:"yourlocal.dev",
50
-
port:80
51
-
}
46
+
proxy: {
47
+
host:"yourlocal.dev",
48
+
port:80
49
+
}
52
50
});
53
51
});
54
-
55
52
```
53
+
56
54
There's a [full list of available options](https://github.com/shakyShane/browser-sync/wiki/Working-with-a-Config-File) on the module's repo.
57
55
58
-
##NOTE: at least version 0.8.0 is required for the following examples!##
56
+
## NOTE: at least version 0.8.0 is required for the following examples! ##
57
+
58
+
### Auto reload & CSS injecting
59
59
60
-
###Auto reload & CSS injecting
61
60
Streams are now supported in BrowserSync, so you can call `reload` when all your tasks are complete & all browsers will be informed of the changes.
62
61
63
62
**Gulp + SASS + CSS Injecting**
@@ -90,13 +89,14 @@ gulp.task('sass', function () {
90
89
gulp.task('default', ['sass', 'browser-sync'], function () {
91
90
gulp.watch("scss/*.scss", ['sass']);
92
91
});
93
-
94
92
```
93
+
95
94
**SASS & Source Maps**
96
95
97
96
If you use [gulp-ruby-sass](https://www.npmjs.org/package/gulp-ruby-sass) with `sourcemap: true` option `*.css.map` file/files will be generated and after css injection browser will be reloaded. To prevent refreshing page after css injection use [gulp-filter](https://www.npmjs.org/package/gulp-filter) package.
98
97
99
98
For example:
99
+
100
100
```js
101
101
//other necessary packages
102
102
var filter =require('gulp-filter');
@@ -108,15 +108,14 @@ gulp.task('sass', function () {
108
108
.pipe(filter('**/*.css')) // Filtering stream to only css files
109
109
.pipe(browserSync.reload({stream:true}));
110
110
});
111
-
112
111
```
112
+
113
113
**Browser Reloading**
114
114
115
115
Sometimes you might just want to reload the page completely (for example, after processing a bunch of JS files) - you can do that
116
116
by passing `once` as an option. This will stop `reload` being call multiple times.
117
117
118
118
```js
119
-
120
119
// start server
121
120
gulp.task('browser-sync', function() {
122
121
browserSync.init(null, {
@@ -174,14 +173,14 @@ gulp.task('default', ['browser-sync'], function () {
174
173
gulp.watch("scss/*.scss", ['sass']);
175
174
gulp.watch("*.html", ['bs-reload']);
176
175
});
177
-
178
176
```
179
177
180
-
###Screencasts
178
+
### Screencasts
179
+
181
180
Coming soon. If you want to see anything specific covered in the screencasts, please ask me [@shaneOsbourne](https://www.twitter.com/shaneosbourne)
182
181
182
+
## Support
183
183
184
-
##Support
185
184
If you've found Browser-sync useful and would like to contribute to its continued development & support, please feel free to send a donation of any size - it would be greatly appreciated!
186
185
187
186
[](https://www.gittip.com/shakyshane)
0 commit comments