前端实时可视化开发工具:liveStyle、liveReload、Broswer-Sync。

一、liveStyle

如图,liveStyle支持三种文件。

需要安装两个插件:浏览器的插件,sublime编辑器中的livestyle插件。
浏览器的插件可以通过Chrome的网上商店安装。

**注意:**liveStyle主要针对样式的修改,实现浏览器和编辑器双向修改,不能修改HTML和js文件。

二、liveReload

liveReload监控所有文件的修改。样式文件、html文件、图片文件、js文件等的修改以及实时浏览器显示。

需要安装liveReload插件(在Chrome网上商店下载)和node.js中livereload插件

本质做了个F5操作。

三、Broswer-Sync

本质是启动一个代理服务器,监听服务器变化。支持所有文件的实时监听。

不需要装服务器插件,只依赖于node.js插件,要装Broswer-Sync插件,是一个局部的刷新。可以实现手机浏览器、PC浏览器等多个浏览器的同步,包括视图同步和交互同步。

要在前端项目文件下进行监控,如果在根目录下启动,会慢,因为监控的文件太多。

四、总结

HTML——前端实时可视化开发工具相关推荐

  1. 2022 前端常用的开发工具、组件库等等~持续整理,待你分享~

    2022 前端常用的开发工具.组件库等等持续整理,待你分享 小伙伴们!我这里整理了一些对前端开发有帮助的工具.库.网站等.对于这些东西有些是我自己用过的,有些是听过的,但是也有些是没听过也没用过的.只 ...

  2. Echarts+D3可视化开发工具集

    Echarts+D3可视化开发工具集 一.前言 ​ 大学三年期间,学的很杂,但唯一坚持的就是在做可视化开发,有个负责任的指导老师很重要.因为即将大四,之后不一定会再继续朝这个方面学习,所以把之前参加比 ...

  3. 桌面html开发工具,html5可视化开发工具_html5可视化_html5可视化设计工具 - 帆软

    HTML5不是一种编程语言,而是一种标记语言,是程序员开发网页必用的一种开发工具.目前来说HTML5技术是非常火爆的,而且有专家预估在未来的10年HTML技术都不会过时.HTML5前景好,来学HTML ...

  4. React 可视化开发工具 Shadow Widget 非正经入门(之四:flux、mvc、mvvm)

    本系列博文从 Shadow Widget 作者的视角,解释该框架的设计要点.本篇解释 Shadow Widget 在 MVC.MVVM.Flux 框架之间如何做选择. 1. React Flux 框架 ...

  5. 前端页面可视化设计工具

    (3条消息) [html]前端页面可视化设计工具总结_XYZ-CSDN博客_html可视化布局工具

  6. FlyFish|前端数据可视化开发避坑指南(二)

    FlyFish是云智慧开源的一款数据可视化编排平台.通过配置数据模型为用户提供上百种可视化图形组件,零编码即可实现符合自己业务需求的炫酷可视化大屏. 同时,FlyFish也提供了灵活的拓展能力,支持组 ...

  7. 前端页面组件开发工具Pager-taglib

    前端页面组件开发工具Pager-taglib 一.Pager-taglib简介 1.Pager-taglib ​ 支持多种风格的分页显示.它是一个Jsp标签库,为在JSP上显示分页信息而设计的一套标签 ...

  8. WINX可视化开发工具的初步设想

    以WINX界面库为开发平台 是的,WINX可视化开发工具本身,可能会成为第一个基于WINX并开源的完整应用(当然,不排除其他人比我们更早一步). 以VS2003/VS2005的插件融合到Visual ...

  9. 推荐25款很棒的 HTML5 前端框架和开发工具【下篇】

    快速,安全,响应式,互动和美丽,这些优点吸引更多的 Web 开发人员使用 HTML5.HTML5 有许多新的特性功能,允许开发人员和设计师创建应用程序和网站,带给用户桌面应用程序的速度,性能和体验. ...

最新文章

  1. 深度学习背后的基础-神经网络揭秘
  2. jQuery Mobile和PhoneGap混合开发
  3. Alpha(5/10)
  4. ubuntu下配置bind9为局域网的DNS服务器
  5. android 判断手机计步_干货:电脑控制手机 一定不能错过的神器
  6. 关于vector的迭代器失效的问题
  7. [转]Redis持久化存储(AOF与RDB两种模式)
  8. 通过快速Java和文件序列化加快速度
  9. js删除mysql记录_(DELETEUPDATE)修改、删除数据记录_MySQL
  10. 模线性方程(中国剩余定理+扩展中国剩余定理)
  11. 中科院等发布《2019研究前沿》
  12. 本周 火火火火火 的开源项目
  13. mysql group by cube_SQL Server 之 GROUP BY、GROUPING SETS、ROLLUP、CUBE
  14. fread与fread_s读取文件(二进制文件)
  15. Python 3.65 pip升级出现ModuleNotFoundError: No module named 'pip'问题
  16. Redis入门整合springboot
  17. 基于Java+Swing实现雷电小游戏
  18. 赛扬处理器_海尔逸15笔记本仅2299元,其酷睿10代赛扬处理器是什么情况?
  19. IDEA Maven 依赖分析插件Maven Helper
  20. 第一次和喜欢的女生吃饭该去哪吃?

热门文章

  1. 数据分析AB测试实战项目
  2. 用BAT创建文件夹,创建文件,回显环境变量
  3. 中国工商银行数据中心(北京)一面--2011
  4. 【笔记】 C++中 方向键的输入
  5. 天长地久 (20分)
  6. 博雅数智|第四次直播|PageRank算法
  7. 软件测试需要学什么?零基础如何入门软件测试?
  8. 使用计算机有关的活动,与计算机有关的传统文化活动策划书
  9. pandas读取csv文件UnicodeDecodeError: ‘utf-8‘ codec can‘t decode byte 0xca in position 37: invalid contin
  10. python方差检验分析(ANOVA)