Rubymine的实时预览/ WYSIWYG支持或插件?

时间:2013-04-17 20:15:57

标签: html css wysiwyg rubymine live-preview

我正在使用Rubymine 5.4 for Windows,它总体上令人惊叹,95%与Visual Studio一样好,只有少数例外的HTML / CSS编辑器......主要是缺乏实时预览/ WYSIWYG能力,即因为我输入我可以看到生成的预览直播(除了VS,DreamWeaver也有此功能)。我似乎无法在IDE,帮助或任何Google / Stack搜索中找到类似的内容。

要清楚,我正在寻找的是在RubyMine中使用分屏视图的方法,我可以在一个窗格/选项卡中编辑我的HTML / CSS并看到它的外观的实时预览另一个标签/窗格中的浏览器。

理想情况下,这将是:

  1. 在RubyMine本身(使用如上所述的原生窗格/标签)
  2. 用户可以配置他们想要在...中查看预览的任何浏览器渲染引擎(Chrome,FF,IE等)...
  3. ...但是,我可以忍受上述两种变体,例如:简单地使用外部窗口/浏览器与RubyMine集成,或者,预览仅适用于有限的渲染引擎(仅限Chrome)。

1 个答案:

答案 0 :(得分:5)

感谢@CrazyCoder& @LazyOne指点......

经过一番研究,我已经确认并获得了更多细节:

解决方案是使用官方Jetbrains(RubyMine的制造商)LiveEdit插件,您可以在此处找到:http://plugins.jetbrains.com/plugin/?id=7007


详细说明

  1. 从此处下载 JetBrains LiveEdit插件 http://plugins.jetbrains.com/plugin/?id=7007
  2. 运行Rubymine > Settings > Plugins(在搜索中输入“plugins” 设置中的方框)
  3. 点击列表底部的Install Plugin from disk按钮
  4. 导航到您下载插件的位置,然后选择/打开它
  5. 通过在插件列表中查看来激活
  6. (您可能需要)重启RubyMine
  7. 重新启动后,转到menubar > View > LiveEdit(将会进行检查)
  8. 在此处下载 JetBrains IDE浏览器Extension for Chrome https://chrome.google.com/webstore/detail/jetbrains-ide-support/hmhgeddbohgjknpmjagkdomcpobmllji?utm_source=chrome-ntp-icon
    • Chrome扩展程序支持IDE外部的 WYSIWYG /实时“LiveEdit” ,外部Chrome窗口以及实际RubyMine IDE中的JavaScript调试
    • 我相信FireFox还有一个扩展,我相信它也支持 通过IDE调试Javascript。 BUt,我不确定它是否支持像Chrome扩展程序那样的LiveEdit
  9. (启动)调试项目
  10. 按照惯例编辑
  11. 观测/意见

    该插件几乎无缝地工作。我发现它不需要经常手动重新加载页面就可以显着缩短开发时间,即使用鼠标或键盘将焦点带到浏览器窗口并点击刷新...这一次尤其如果你做了很多HTML / CSS并希望经常检查您的更改。

    但是,如果您要进行任何主要的后端/ Rails或Javascript,我建议将其关闭,因为由于代码解释/处理,重新加载可能会稍长一些,并且当您处于中间时遇到错误语句和LiveEdit决定在未定义变量或具有不正确的值时刷新。在这种情况下,您不必手动刷新所节省的时间可能会丢失(超过1倍)b / c在服务器端或JS中创建/呈现内容的频率和时长在客户端。