Turbolinks外部javascript(这里:ACE编辑器)



我正在尝试在使用涡轮链接的页面中实现ACE编辑器。但是,编辑器仅在我直接调用该页面或重新加载页面时起作用。导航到它不会触发使编辑器工作所需的每个步骤。

当前集成:

<script src="//cdnjs.cloudflare.com/ajax/libs/require.js/2.1.8/require.js" type="text/javascript" charset="utf-8"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/ace/1.1.01/ace.js" type="text/javascript" charset="utf-8"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/ace/1.1.01/mode-html.js" type="text/javascript" charset="utf-8"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/ace/1.1.01/mode-css.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript" charset="utf-8">
  function initialize_editor() {
    var editor = ace.edit("html-editor");
    editor.setTheme("ace/theme/clouds");
    editor.getSession().setMode("ace/mode/html");
    editor.setValue($('#template_html').val());
    $('form').on('submit', function(event) {
      $('#template_html').val(editor.getValue());
    });
  }
  $(document).ready(initialize_editor);
  $(document).on('page:load', initialize_editor);
</script>

这抛出了一个Uncaught TypeError: Cannot read property 'ace/ace' of undefined. 离开页面后,js似乎卡在页面上,每次导航加载时,我都会得到一个Uncaught ReferenceError: ace is not defined

在此处包含 ACE 编辑器(或其他外部库(的正确方法是什么?通过链轮加载它们是行不通的,当将它们复制到vendor/javascripts/并要求它们在链轮清单中时,我很难让它正常运行。

关于涡轮链接和正确方法的任何启示?

我可以通过获取所需的js文件并将它们放入供应商/javascript路径来解决它。空格和制表符的特殊字符的初始问题(其他人也在这里报告(可以通过使用 BOM 将文件显式存储为 utf8 来解决。

相关内容

  • 没有找到相关文章

最新更新