前端设计之实时预览工具有推荐的吗?

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

这是一个创建于 3866 天前的主题，其中的信息可能已经有所发展或是发生改变。

实现js/css/html实时预览
发现2个,一个速度太慢(https://thimble.webmaker.org/en-US/),一个太丑(http://htmledit.squarefree.com/).

预览

实时

16 条回复 • 2014-05-27 12:07:45 +08:00

ritksm

2014-05-20 17:28:31 +08:00

LiveReload不好么
http://livereload.com/

learnshare

2014-05-20 17:42:50 +08:00

Grunt watch 已经有 LiveReload 功能了吧

dong3580

2014-05-20 17:46:38 +08:00

Microsoft Visual Studio

itcook

2014-05-20 17:51:03 +08:00

再推荐个 Adobe 的 Brackets.

http://brackets.io/

jsonline

2014-05-20 18:51:59 +08:00 via Android

不喜欢实时预览，好烦。

要推荐的话，还是 WebStorm，它很早就自带这个功能了

jsonline

2014-05-20 18:52:56 +08:00 via Android

其实最叼的是 Chrome 的 Workplace

loading

2014-05-20 18:55:24 +08:00 via Android

Dreamweaver

jiyinyiyong

2014-05-20 18:56:21 +08:00

Brackets +1

再加一组视频: http://www.tudou.com/plcover/9wTYkD2t3RM/

另外 Chrome 开发工具也能做到 CSS 实时预览,
Brackets 就是基于 Webkit 的 Remote Debugging API 实现的.

iinterest

2014-05-21 07:43:55 +08:00

试用过 idea（WebStorm）的插件、F5、Grunt watch，最后还是用 Grunt watch 了，它集成了LiveReload 后非常方便

javaluo

2014-05-21 08:22:10 +08:00

http://www.getf5.com

zjnewcity

2014-05-21 09:00:06 +08:00

@iinterest Grunt watch主页是哪一个? google一番, 感觉搜索结果很奇怪.....

iinterest

2014-05-21 09:48:42 +08:00

grunt-contrib-watch： https://github.com/gruntjs/grunt-contrib-watch，首先你得有 nodejs + Grunt

andyhu

2014-05-21 11:02:41 +08:00

如果需要非常简单的测试工具的话，可以用下这个
https://chrome.google.com/webstore/detail/hfgifphlikdnjfcegkkmhohddfjhnpjd
或者在线的
runjs.cn

lisposter

2014-05-21 11:34:25 +08:00

Grunt，压缩，合并，混淆，实时预览，开发与部署轻松分开，你值得拥有。

Grunt 在手，世界我有。

openroc

2014-05-22 14:46:41 +08:00

https://www.nitrous.io/

sconfield

2014-05-27 12:07:45 +08:00

哈哈，涨姿势了，正好试试 LiveReload，谢谢 @ritksm @learnshare @lisposter