`

livereload自动通知页面重刷新的轻量级server

 
阅读更多

概述:

它是一个基于node的轻量级web server。它可以监听你的css、js、html文件变化自动通知浏览器刷新页面,或者重新载入css文件。它最大的特点就是不用你手工修改html或者使用浏览器插件来建立前后端通讯,而是动态的在html中插入一段无干扰的JS。如果你是做一些前端的练习或者建立前端的测试页面,那么它就很有用了。

 

安装:

  • 安装node 0.60+(自带npm) http://nodejs.org/
  • 安装livereload:npm install -g livereload1
运行:
到你项目的根路径下执行命令:livereload
然后用浏览器打开http://localhost:3000/ 导航到html页面
修改前端文件(html\css\js)就可以看到页面自动刷新了

运行环境:
服务端支持node就行,浏览器端已测试 Chrome 20.0 Firefox 12.0 IE 8

更多信息:
请访问项目的托管页面:https://github.com/chemzqm/livereload

 

分享到:
评论
1 楼 hopesfish 2012-06-10  
你又开始写blog了 不容易啊 panwei

相关推荐

    Python库 | django-livereload-server-0.3.3.tar.gz

    `django-livereload-server` 是一个基于Python的轻量级实时刷新服务器插件,专为Django框架设计。这个库的目的是为了在开发环境中提供自动刷新功能,每当项目中的静态文件或模板发生更改时,浏览器会自动刷新页面,...

    django-livereload-server:与Django开发环境集成的Livereload功能

    它通过一个轻量级的服务器监听你的Django项目文件,一旦检测到文件变化,就会通过WebSocket协议发送指令给安装了Livereload浏览器扩展的开发者浏览器,实现即时刷新。 **集成步骤**: 1. **安装**: 首先,你需要在...

    light-server:轻量级的cli static http服务器,它可以监视文件,执行命令并触发livereload

    轻量级的cli static http服务器,它可以监视文件,执行命令并触发livereload。 为什么选择光服务器 当我编写一些简单的静态Web应用程序时,使用一些工具来提供静态http,监视文件和运行命令以及在浏览器中触发刷新会...

    前端页面编辑器

    Sublime Text以其轻量级、高性能和高度可定制性著称。以下是一些关于Sublime Text的重要特性: 1. **多选与多重编辑**:Sublime Text允许用户同时选择并编辑多个文本位置,大大提高了代码修改的效率。 2. **分屏...

    前端开源库-grunt-macreload

    另一个选项是使用Gulp,一个与Grunt类似但更轻量级的任务运行器,它也有实时刷新的插件如`gulp-livereload`。 **前端开发工具链**:在前端开发中,构建工具是不可或缺的一部分。除了Grunt和Gulp,还有更先进的工具...

    asp.net/aspx本地测试工具一键本地测试asp.net程序

    1. **快速启动**:工具能够快速启动一个内置的Web服务器,如IIS Express或轻量级的Web服务器(如压缩包中提到的WebServer1.6.22.2.exe,可能是Cassini或类似的替代品),这样开发者就可以立即在本地运行和查看ASP...

    前端开源库-tamia-build

    tamia-build 包含的 dev server 是一个轻量级的本地开发服务器,它支持实时刷新(LiveReload)和热更新(Hot Module Replacement)。在开发过程中,任何源代码的更改都会立即反映到浏览器中,大大提高了开发效率。...

    scss-system-innovation

    1. **Handlebars (hbs)**:这是一个轻量级的模板引擎,用于分离HTML结构与数据。它允许开发者在HTML中使用表达式和助手函数,以动态生成页面内容。Webpack可以借助`handlebars-loader`处理.hbs文件,将其编译为...

    rave-build:基于 rave 的应用程序的默认最小构建模式

    5. **自动刷新**:集成 LiveReload 或 webpack-dev-server,实现浏览器实时刷新,提升开发效率。 6. **静态资源处理**:优化图片、字体等静态资源,减小其在网络传输中的大小。 **使用流程:** 1. **安装**:首先,...

    realword-vue

    它通常会运行一个开发服务器,如 `webpack-dev-server`,该服务器提供热模块替换(Hot Module Replacement)和实时重载(LiveReload)功能,这意味着当代码发生变化时,浏览器会自动刷新,无需手动刷新页面,大大...

    reservation-app

    3. **Gulp**:Gulp是一个自动化构建工具,它可以自动化执行诸如编译Sass、压缩JavaScript、合并文件、 livereload(实时刷新)浏览器等任务,极大地提高了开发效率。`gulp start`命令通常会启动一个本地开发服务器,...

Global site tag (gtag.js) - Google Analytics