我刚开始用 Browsersync 作为前端同步刷新工具,系统是 Windows10 ,目前有两个问题想解决:
第一个是服务器路径问题,每天开始工作我都会 win + x a 打开 powershell ,然后输入:
cd: D:\Work\Website
browser-sync start --server --files "**/*.css, **/*.html, **/*.js"
由于总是重复这两个命令,所以我想能不能一条命令解决呢,在 官方文档 里我找到这么一个例子:
$ browser-sync start --server 'app' --files 'app'
似乎可以在 --server 后写上路径,但是感觉只有 Unix\Linux 才认这种写法,于是我尝试输入:
browser-sync start --server 'D:\Work\Website '
果然不能解决我的问题。不知道 powershell 或者说 Windows 里怎么表达 D:\Work\Website 这个绝对路径,求解。
第二个是我经常会用多台设备测试页面效果,但是 Browsersync 会诡异地把浏览行为也同步了,比如我在平板上把页面往下拉,在手机和电脑里的同一个页面也会跟着动,请问有什么办法独立各个设备(或者说浏览器)的浏览行为?
1
kimoCHG 2016-11-06 22:08:31 +08:00
Solution:
安装 gulp npm install -g gulp npm install gulp --save-dev 安装 browser-sync npm install browser-sync --save-dev D:\Work\Website 下 新建 gulpfile.js var gulp = require('gulp'), browserSync = require('browser-sync'); gulp.task('default', function() { var files = [ '**/*.html', '**/*.css', '**/*.js', ]; browserSync.init(files, { server: { baseDir: "./", index: "index.html" } }); // Watch any files in dist/, reload on change gulp.watch(['*.*']).on('change', browserSync.reload); }); Now,每天 cd D:\Work\Website 运行 gulp 现写的可能会有点小问题,试试看呗,可以参考 https://www.browsersync.io/docs/gulp 自己再改改 |
2
joname 2016-11-11 17:03:00 +08:00
安装个 git,
然后在工作目录右键 git bash here, 输入 browser-sync start --server --files "**/*.css, **/*.html, **/*.js" 几秒钟的事. |
3
ai7hoo 2017-01-05 22:37:30 +08:00
针对第二个问题回答一下,开启服务后默认会打开浏览器,地址像 http://localhost:3000 这样的,那么你可以打开 http://localhost:3001 就可以配置 browser-sync 了。左侧导航栏有个 sync options ,点击进去可以自己配置各种设备的同步选项。
这些在命令窗口都是有提示的 如下: Running "browserSync:files" (browserSync) task [BS] Proxying: http://localhost:81 [BS] Access URLs: ------------------------------------- Local: http://localhost:3000 External: http://192.168.1.84:3000 ------------------------------------- UI: http://localhost:3001 UI External: http://192.168.1.84:3001 ------------------------------------- [BS] Watching files... |