【前言】此处介绍的方法只是我个人的用法,相信大家有更好更简洁的方式。

上次写到利用LiveReload解放F5。而且LiveReload可以编辑sass/less/stylus。但是可惜发现LiveReload在编译的时候不能抛错,这就很麻烦了,少了个标点less编译就不过,查找起来太麻烦。

我目前的解决方法:

利用Less自带的客户端开发模式(development)。

在开发的时候less的编译还是利用客户端浏览器,即

<link rel="stylesheet/less" type="text/css" href="styles.less" />
<script src="js/less-1.7.3.min.js" type="text/javascript"></script>

less自带监视模式,开启方式是在

<script src="js/less-1.7.3.min.js" type="text/javascript"></script>

的后面加入:

<script>less.watch();</script>

 

这样的话,less就能实时监视变化并改变样式,而且可以抛错。

 

还有一种方法

是利用Koala       这个软件,先提一下,这个软件是国内腾讯一个工程师开发的,是less官方推荐的GUI之一,这个软件功能基本功能和LiveReload差不多,也是监控文件夹的改变。但是扩展功能和设置项更加强大,内置了编译器可以抛错。大家可以关注下,在持续开发中。

但是这个软件不能实时刷新浏览器。本质上是个编译合并压缩工具,希望它后续能增加刷新功能。

利用less监视模式实时预览样式刷新浏览器的更多相关文章

  1. UI实时预览最佳实践(转)

    UI实时预览最佳实践 概要:Android中实时预览UI和编写UI的各种技巧.本文的例子都可以在结尾处的示例代码中看到并下载.如果喜欢请star,如果觉得有纰漏请提交issue,如果你有更好的点子可以 ...

  2. Android中实时预览UI和编写UI的各种技巧

    一.啰嗦 之前有读者反馈说,你搞这个所谓的最佳实践,每篇文章最后就给了一个库,感觉不是很高大上.其实,我在写这个系列之初就有想过这个问题.我的目的是:给出最实用的库来帮助我们开发,并且尽可能地说明这个 ...

  3. MWeb 1.4 新功能介绍一:引入文件夹到 MWeb 中管理,支持 Octpress、Jekyll 等静态博客拖拽插入图片和实时预览

    之前在 MWeb 中打开非文档库中的 Markdown 文档,如果文档中有引用到本机图片,是没办法在 MWeb 中显示出来和预览的.这是因为 Apple 规定在 Mac App Store(MAS) ...

  4. 一个支持实时预览的在线 Markdown 编辑器 - Markdoc

    最近组内需要为一些项目和系统写文档,发表在公司内的文档平台上,这个平台并不支持markdown,所以打算做一个在线markdown编辑器,支持实时预览,并且可以很容易的迁移发表到公司文档平台上,所以就 ...

  5. 实时预览的在线 Markdown 编辑器 - Markdoc

    实时预览的在线 Markdown 编辑器 - Markdoc 最近组内需要为一些项目和系统写文档,发表在公司内的文档平台上,这个平台并不支持markdown,所以打算做一个在线markdown编辑器, ...

  6. Sublime下MarkDown插件实现编辑和实时预览并转换成HTML格式

    最近在使用markdown做笔记,编辑器Sublime Text3用起来很轻巧,现在让他支持markdown的语法并且可以实时预览. 安装准备——安装Package Control Package C ...

  7. 用 grunt-contrib-connect 构建实时预览开发环境 实时刷新

    本文基本是参照着 用Grunt与livereload构建实时预览的开发环境 实操了一遍,直接实现能实时预览文件列表,内容页面.不用刷新页面了,这比以前开发网页程序都简单. 这里要用到的 Grunt 插 ...

  8. 自己动手开发更好用的markdown编辑器-04(实时预览)

    这里文章都是从个人的github博客直接复制过来的,排版可能有点乱. 原始地址 http://benq.im/2015/04/25/hexomd-04/   程序打包   文章目录 1. 打开新窗口 ...

  9. [个人开源]vue-code-view:一个在线编辑、实时预览的代码交互组件

    组件简介 vue-code-view是一个基于 vue 2.x.轻量级的代码交互组件,在网页中实时编辑运行代码.预览效果的代码交互组件. 使用此组件, 不论 vue 页面还是 Markdown 文档中 ...

随机推荐

  1. MSBI BigData demo—sqoop import

    --sp_readerrorlog 读取错误的信息记录 exec sys.sp_readerrorlog 0, 1, 'listening'查看端口号 首先hadoop环境要配置完毕,并检验可以正常启 ...

  2. JavaScript测试工具

    大家都知道Javascript的测试比较麻烦,一般是开发使用一些浏览器的插件比如IE develop bar或是firebug来调试,而测试往往需要通过页面展示后的js错误提示来定位.那么还有其他比较 ...

  3. 异常:NSException和NSAssert的简单使用

    //断言 - (void)NSAssert_Test:(NSString *)string{ NSAssert(string == nil, @"string == kong or nil& ...

  4. 09Mybatis_入门程序——删除用户以及更新用户

    删除用户: 还是前面的的案例,别的都不改,就修改两处地方.1.user.xml文件以及2.Mybatis_first.java文件 user.xml文件代码修改如下: <?xml version ...

  5. 第二章 时间控件(DateTime Picker)

    这家伙太懒了,碰到问题才写博文,嘿嘿. 好了进入正题,二话不说,先放地址: 中文:http://www.bootcss.com/p/bootstrap-datetimepicker/index.htm ...

  6. 我的WCF摸爬滚打之路(2)

    昨天抽空写了一个wcf的创建和宿主程序的创建文章,下面也有很多园友给了评论,在此谢谢大家给了我继续记录我的摸爬滚打之路信心……抱拳! 上次的文章<我的WCF摸爬滚打之路(1)>中写到,在测 ...

  7. ab压测&htop工具

    1,apache bech 参考: http://www.nginx.cn/110.html http://www.ha97.com/4617.html ===================== y ...

  8. qrcodeJS生成二维码

    后续抽时间自己来整理笔记 http://code.ciaoca.com/javascript/qrcode/

  9. [转]面向GPU的多LOD因子的大规模场景可视化策略

    直接附上原文链接: 1.面向GPU的多LOD因子的大规模场景可视化策略 2.Real-Time Dynamic Level of Detail Terrain Rendering with ROAM

  10. 神奇的main方法详解

    main函数的详解:    public : 公共的. 权限是最大,在任何情况下都可以访问.        原因: 为了保证让jvm在任何情况下都可以访问到main方法.    static:  静态 ...