browsersync 插件
自从发现了这个 browsersync 插件 ...
在也不用每次改一行代码就去手动刷新 HTML 页面了
省去了很多繁琐的操作,当有多个显示器的时候,更加的方便,在IDEA上编辑代码之后,点击 command + s 保存之后即可马上在另外的显示器上看到 HTML 效果的改动。
安装
前置条件
BrowserSync
是基于 Node.js
的。是一个 Node 模块。因此安装之前先安装一下 Node.js
安装 BrowserSync
使用命令安装,若报错,前面加 sudo
npm install -g browser-sync
使用
cd 到项目文件夹,使用下列命令,监听所有文件即可
browser-sync start --server --files="**/*"
之后会弹出 HTML 页面,或者通过 http://localhost:3000/ 进行访问。
相关网站与文档
browsersync 插件的更多相关文章
- gulp自动刷新插件
gulp自动刷新的插件很多,但是感觉最好用的还是 browser-sync 插件.如果不想用命令行,也可以使用 browser-sync界面工具 先安装 browser-sync 插件: npm in ...
- gulp + browserSync 一起提高前端开发效率吧!
前端开发的时候,每次修改代码后,要移动鼠标到浏览器选中再刷新查看效果,不知觉间我们的加班的时间又增加了0.5s, 真是罪孽!所以在使用gulp之后,就一直对能自动监听文件刷新页面的browserSyn ...
- webpack与browser-sync热更新原理深度讲解
本文首发于CSDN网站,下面的版本又经过进一步的修订.原文:webpack与browser-sync热更新原理深度讲解本文包含如下内容: webpack-hot-middleware EventSou ...
- 由VMnet引起的browser-sync故障解决方案
(2019年2月19日注:这篇文章原先发在自己github那边的博客,时间是2016年7月11日) 今天晚上,前端组的小伙伴问我说能不能帮忙看看他的电脑为什么在安装了browser-sync插件以后, ...
- vue 项目使用局域网多端访问并实时自动更新(利用 browser-sync)
在写vue的项目中时,虽然vue会自动更新页面,但是切换页面切来切去也很麻烦,有时候我们还要在公司另一台电脑或者手机上调试,这时候利用browser-sync插件,无需改动vue的代码即可实现: 1. ...
- 前端工具之Gulp
Gulp是一款前端自动化的工具,如果能熟练使用Gulp来进行开发一定可以节省很多的时间,也可以快速的提高工作效率. 在使用Gulp之前就是要配置好Gulp安装的环境,这是我们能使用Gulp快速开发的第 ...
- 自动化前端构建工具--gulp
Gulp是一个基于任务的javascript工程命令行流式构建工具.为什么要用Gulp呢?前端开发进入到工程化阶段,我们需要压缩合并文件,加MD5戳:如果使用 CoffeeScript/ES6 去代替 ...
- Gulp 学习总结
Gulp 自动化工具开发非常方便,便于上手,值得使用. 一.Gulp安装 gulp是基于NodeJS运行的,所以需要想安装NodeJS. http://nodejs.org/download/ 安装 ...
- [转发]Gulp开发教程(翻译)
Building With Gulp =================== 转载出处 原文地址 翻译出处 对网站资源进行优化,并使用不同浏览器测试并不是网站设计过程中最有意思的部分,但是这个过程中的 ...
随机推荐
- HTML5学习总结——相关练习与项目
一.小米商城项目 第一天示例代码: <!DOCTYPE html> <html lang="en"> <head> <meta chars ...
- SSH工具脚本录入
SSH工具提供的脚本录制功能如下: Xshell:登陆脚本 SecretCRT:录制脚本,保存本地,登陆后选择执行 mRemoteNG :暂时没发现有脚本录入功能
- 课时47.datalist标签(了解)
1.datalist标签 作用:给输入框绑定待选项 2.datalist格式: <datalist> <option>待选项内容</option> </dat ...
- 系统优化怎么做-Tomcat优化
大家好,这里是「聊聊系统优化 」,并在下列地址同步更新 博客园:http://www.cnblogs.com/changsong/ 知乎专栏:https://zhuanlan.zhihu.com/yo ...
- Swift_初始化
#Swift_初始化 点击查看源码 初始化结构体 //初始化结构体 func testInitStruct() { //结构体 类中默认方法 struct Size { //宽 var width = ...
- jQuery入门简单实现反选与全选
//html代码<input type="checkbox" id= 'all' value="全选"> 选择全部 一键上路 <input t ...
- 【HDOJ 1337】I Hate It(线段树维护区间最大值)
Problem Description 很多学校流行一种比较的习惯.老师们很喜欢询问,从某某到某某当中,分数最高的是多少.这让很多学生很反感. 不管你喜不喜欢,现在需要你做的是,就是按照老师的要求,写 ...
- 剑指Offer_编程题之替换空格
题目描述 请实现一个函数,将一个字符串中的空格替换成“%20”.例如,当字符串为We Are Happy.则经过替换之后的字符串为We%20Are%20Happy.
- 搭建Apache服务器并使用自签证书实现https访问
实验环境:两台Centos7.2的虚拟机,一台作CA服务器,一台作Apache服务器,此处安装httpd-2.4.6的版本. 1)CA服务器 # 私钥一般存放位置:/etc/pki/CA/privat ...
- Cannot send session cache limiter - headers already sent问题
在php.ini中将“always_populate_raw_post_data ”设置为“-1”,并重启