Rails 6 - Javascript: Uncaught ReferenceError: Quill is not

Question

我正在尝试在Rails 6应用程序上设置Quill on Rails 6应用程序。当我将js文件放在html中时，它可以工作，它看起来像这样：新.html.erb

<div id="editor">
<p>Hello World!</p>
</div>
<script src="https://cdn.quilljs.com/1.3.6/quill.js"></script>
<!-- Initialize Quill editor -->
<script>
var quill = new Quill('#editor', {
theme: 'snow'
});
</script>

但是，当我尝试运行本地js文件时，它给了我一个错误

Uncaught ReferenceError: Quill is not defined
at Object../app/javascript/src/editor.js (editor.js:1)

这是我的应用程序.js文件

require("@rails/ujs").start()
require("turbolinks").start()
require("@rails/activestorage").start()
require("channels")
require("src/quill.js")
require("src/editor.js")

这是我的编辑器.js文件

var quill = new Quill('#editor', {
theme: 'snow'
});

Quilljs 是整个库文件。

我的应用程序.html.erb也有这个标签

<%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>

两个js文件都会加载，因为我可以看到我在控制台中设置的控制台.log值。我不确定我做错了什么，似乎没有人遇到过类似的问题。

Answer 1

您可能只需要等待 DOM 加载，然后再创建 Quill 的实例。这个问题是去年问过的，所以希望你已经找到了解决方案。如果没有，您可以尝试这样的事情：

document.addEventListener("DOMContentLoaded", function (event) {
var quill = new Quill('#editor', {
theme: 'snow'
});
});

如果你或其他任何人感兴趣，我写了一篇关于我最近将QuillJS添加到Rails 6的经历的博客文章，这可能会有所帮助。诚然，这篇文章没有详细介绍这个特定问题，但代码片段确实解决了它，并且可以更普遍地提供更多配置帮助。

Answer 2

你的asset.rb有吗？

Rails.application.config.assets.precompile += %w( application.js )