“每 x 秒重新加载一次”可以通过浏览器扩展轻松实现,例如我已经使用了一段时间的 Chrome 的 Auto Refresh Plus(它似乎不再存在......)或数十种替代方案中的任何一个对于 Firefox、Opera 或 Safari。
Zen Coding is very powerful but it has nothing to do with live preview.
You can't have live preview because Vim only writes on the disc when you explicitly ask with :w or a similar command. Whatever you do between two "writes" happens in memory (hence "buffers") so, you can reload the file in your browser as many times as you want you won't have authentic live preview: the file is still the same.
You are left with two possibilities: "reload on save" and "reload every x seconds".
I don't know of a reliable/easy/cross platform/cross browser way to achieve "reload on save". LiveReload didn't work for me and its younger sister LR2 is Mac only. Try them if you want. I think I've seen a vim plugin that did that some times ago but I couldn't find the link ATM. One could use Firefox's API, maybe.
"reload every x seconds" can be achieved easily with a browser extension like Auto Refresh Plus for Chrome which I've been using for a while (it doesn't seem to exist anymore…) or any of the dozens of alternatives for Firefox or Opera or Safari.
Quite some time ago, My atari had this thing (using OLGA) that would allow one program to tell another to refresh it's input files.
I don't think anything much exists to force a browser to monitor disk files like this, it only really suits static on-disk HTML/CSS work, tbh there isn't much of this these days.
That said, with chrome you can get the browser to refresh using ChromeReload for you without resorting to javascript or meta tags. You can get Firefox to do the same with ReloadEvery.
I heard about tincr last saturday at the dotjs conference in Paris. It's a Chrome extension that allows you to:
edit your document in Vim or whatever and see the changes "live" on each :w
play with css rules and stuff in Chrome's dev tools and have your changes propagated in your local files
That's quite cool but I couldn't make the versioning work.
Also, since it's an answer to a common question I'll post it verbatim in other places as well. I hope it's not considered as advertising: I have no relationship whatsoever with the people behind this extension.
The combination of both allows you to live preview php (and other html related), html and css while you are typing. An option allows you to disable the "live" mode to refresh the page only when the buffer is saved. It handle local server files too. So editing a file in /srv/http/** (default path which is mine, but customizable) will launch the browser at http://localhost/** (also customisable).
For css, it launch all files listed in .css.preview, or all index.{php, html, htm} found in the same path if no preview file.
发布评论
评论(4)
Zen Coding 非常强大,但与实时预览无关。
您无法进行实时预览,因为 Vim 仅在您使用
:w
或类似命令明确询问时才在光盘上写入。无论您在两次“写入”之间做什么都发生在内存中(因此称为“缓冲区”),因此您可以根据需要多次在浏览器中重新加载文件,但您不会获得真实的实时预览:文件仍然是相同的。您有两种可能性:“保存时重新加载”和“每 x 秒重新加载”。
我不知道有可靠/简单/跨平台/跨浏览器的方式来实现“保存时重新加载”。 LiveReload 对我和它的妹妹不起作用LR2 仅适用于 Mac。如果你愿意的话可以尝试一下。我想我以前见过一个 vim 插件可以做到这一点,但我找不到链接 ATM。也许可以使用 Firefox 的 API。
“每 x 秒重新加载一次”可以通过浏览器扩展轻松实现,例如我已经使用了一段时间的 Chrome 的 Auto Refresh Plus(它似乎不再存在......)或数十种替代方案中的任何一个对于 Firefox、Opera 或 Safari。
Zen Coding is very powerful but it has nothing to do with live preview.
You can't have live preview because Vim only writes on the disc when you explicitly ask with
:w
or a similar command. Whatever you do between two "writes" happens in memory (hence "buffers") so, you can reload the file in your browser as many times as you want you won't have authentic live preview: the file is still the same.You are left with two possibilities: "reload on save" and "reload every x seconds".
I don't know of a reliable/easy/cross platform/cross browser way to achieve "reload on save". LiveReload didn't work for me and its younger sister LR2 is Mac only. Try them if you want. I think I've seen a vim plugin that did that some times ago but I couldn't find the link ATM. One could use Firefox's API, maybe.
"reload every x seconds" can be achieved easily with a browser extension like Auto Refresh Plus for Chrome which I've been using for a while (it doesn't seem to exist anymore…) or any of the dozens of alternatives for Firefox or Opera or Safari.
不久前,我的 atari 有这个东西(使用 OLGA) 允许一个程序告诉另一个程序刷新其输入文件。
我认为没有太多的东西可以强制浏览器像这样监视磁盘文件,它只适合静态磁盘上的 HTML/CSS 工作,老实说,现在这样的东西已经不多了。
也就是说,在 Chrome 中,您可以使用 ChromeReload 刷新浏览器 为您服务,无需求助于 javascript 或元标记。您可以使用 ReloadEvery< 让 Firefox 执行相同的操作/强>。
Quite some time ago, My atari had this thing (using OLGA) that would allow one program to tell another to refresh it's input files.
I don't think anything much exists to force a browser to monitor disk files like this, it only really suits static on-disk HTML/CSS work, tbh there isn't much of this these days.
That said, with chrome you can get the browser to refresh using ChromeReload for you without resorting to javascript or meta tags. You can get Firefox to do the same with ReloadEvery.
我上周六在巴黎的 dotjs 会议上听说了 tincr。它是一个 Chrome 扩展,允许您:
:w
上“实时”查看更改这很酷,但我无法使版本控制工作。
另外,由于这是对常见问题的回答,我也会将其逐字发布在其他地方。我希望这不会被视为广告:我与此扩展背后的人没有任何关系。
I heard about tincr last saturday at the dotjs conference in Paris. It's a Chrome extension that allows you to:
:w
That's quite cool but I couldn't make the versioning work.
Also, since it's an answer to a common question I'll post it verbatim in other places as well. I hope it's not considered as advertising: I have no relationship whatsoever with the people behind this extension.
您可以测试我刚刚为此目的制作的插件(和浏览器): http://www.vim.org/scripts/script.php?script_id=4908
和浏览器(需要从源代码编译):https://gitorious.org/clcbrowser/clcbrowser
(我很快就会做一个 Windows 安装程序)
两者的组合允许您在打字时实时预览 php(和其他 html 相关)、html 和 css。一个选项允许您禁用“实时”模式,以便仅在保存缓冲区时刷新页面。它也处理本地服务器文件。因此,编辑 /srv/http/** 中的文件(默认路径是我的,但可自定义)将在
http://localhost/**
(也可自定义)启动浏览器。对于 css,它会启动 .css.preview 中列出的所有文件,或者如果没有预览文件,则启动在同一路径中找到的所有 index.{php, html, htm}。
You can test the plugin (and the browser) I've just made for this purpose : http://www.vim.org/scripts/script.php?script_id=4908
And the browser (need to compile from sources) : https://gitorious.org/clcbrowser/clcbrowser
(I'll do a windows installer soon)
The combination of both allows you to live preview php (and other html related), html and css while you are typing. An option allows you to disable the "live" mode to refresh the page only when the buffer is saved. It handle local server files too. So editing a file in /srv/http/** (default path which is mine, but customizable) will launch the browser at
http://localhost/**
(also customisable).For css, it launch all files listed in .css.preview, or all index.{php, html, htm} found in the same path if no preview file.