[英]How to use highlight.js with Rails?
我正在尝试在我的Rails应用程序中通过Highlight.js使用语法高亮显示。 以下是有关Highlight.js的说明( https://github.com/isagalaev/highlight.js ):
在网页上使用highlight.js的最基本要求是链接到库以及其中一种样式,然后调用initHighlightingOnLoad:
<link rel="stylesheet" href="/path/to/styles/default.css">
<script src="/path/to/highlight.pack.js"></script>
<script>hljs.initHighlightingOnLoad();</script>
我不确定上述三个应该放在哪里。 我尝试了几种可能性。 大概三个中的第一个<link rel ...>应该放在views / application / application.html.erb的开头。 而且我认为这三个中的第二个<script src = ...>应该放在包含将突出显示的代码的文件的底部。 我认为这三个中的第三个<script ...>应该放在application.js文件中。 无论如何,我都尝试过这种方法以及其他几种方法,但是我无法在Ruby中突出显示所需的代码。
为我工作
创建文件副本app \\ assets \\ javascripts \\ highlight.pack.js(在此处查找文件内容: https : //highlightjs.org/download/ )
创建文件副本app \\ assets \\ stylesheets \\ github.scss(github.scss或您的首选项样式, https ://highlightjs.org/static/demo/)。 不要忘记import @import "github";
进入文件app \\ assets \\ stylesheets \\ application.scss
创建一个文件app \\ assets \\ javascripts \\ highlights.js,并复制以下代码
如果您使用turbolinks:
$(document).on("turbolinks:load", function() {
$('pre code').each(function(i, block) {
hljs.highlightBlock(block);
});
});
如果您不使用turbolinks:
$(document).ready(function() {
$('pre code').each(function(i, block) {
hljs.highlightBlock(block);
});
});
并做了。 重新启动服务器。
您可以将Highlight.pack.js放在您的app / assets / javascripts文件夹中。 它将从那里加载到Rails Asset Pipeline中。
您应该将default.css放在app / assets / stylesheets文件夹中。 它还将从那里加载到Rails Asset Pipeline中(注意,您可能需要将此文件重命名为default.css.scss)。我不确定是否需要添加.scss文件扩展名(也许有人可以如果知道,请编辑此答案-现在,将其重命名为default.css.scss。
...然后将其添加到您的app / assets / javascripts / application.js文件中
$(document).ready(function() {
$('pre code').each(function(i, block) {
hljs.highlightBlock(block);
});
});
在您的视图文件中,您可以使用以下命令:
<pre><code>
Ruby Code Goes Here
</code></pre>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.