jquery - Uncaught ReferenceError : $ is not defined rails

标签 jquery ruby-on-rails froala

我正在尝试将 Froala 编辑器添加到我的项目中。

仅在生产服务器上出现问题(在本地主机上工作正常) 我正在使用 Rails 4.1.0 在 gemfile 中我有

gem 'jquery-rails'

在我的 asset/javascripts/application.js 中:

//= require jquery
//= require jquery_ujs
//= require foundation
//= require turbolinks
//= require_tree .
//= require modernizr
//= require froala_editor.min.js

在 new.html.erb 文件中:

<div class="row">
  <%= form_for :article do |f| %>
    <p>
        Title<br>
        <%= f.text_field :title %>
    </p>
    <p>
        Content<br>
    <%= f.text_area :text, :id=>'content' %>
    <p>
    <%= f.submit %>
    </p>
  <% end %>
</div>
<script>
  $(function() {
    $('div#content').editable({
      inlineMode: false
    })
  });
</script>

在application.html.erb中:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" /> 
    <title><%= content_for?(:title) ? yield(:title) : "foundation-rails" %></title>
    <%= stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track' => true %>
    <%= javascript_include_tag "vendor/modernizr" %>
    <%= javascript_include_tag "application" 'data-turbolinks-track' => true %>
    <%= csrf_meta_tags %>
  </head>
  <body>
    <%= yield %>
  </body>
</html>

在这种情况下结果是:

Uncaught ReferenceError: $ is not defined

如果我添加一个字符串:

<script src="//code.jquery.com/jquery-1.11.2.min.js"></script>

结果是:

Uncaught TypeError: undefined is not a function

最佳答案

以下是我需要为 Rails 6(准确地说是 6.0.3.4)做的事情。 [发现于(所有功劳都归于):https://www.botreetechnologies.com/blog/introducing-jquery-in-rails-6-using-webpacker]

  1. 将 jQuery 添加到环境中。 $ yarn 添加jquery

  2. 在environment.js (/config/webpack/environment.js) 中添加以下代码

     const webpack = require('webpack')
     environment.plugins.prepend('Provide',
     new webpack.ProvidePlugin({
         $: 'jquery/src/jquery',
         jQuery: 'jquery/src/jquery'
     })
     )
    
  3. application.js 文件中需要 jquery。 (/app/javascript/packs/application.js) require('jquery')

  4. (重新启动 Rails 服务器以确保所有内容均已加载。)

关于jquery - Uncaught ReferenceError : $ is not defined rails,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29327004/

相关文章:

javascript - 当我在对象数组中键入时,如何查看数组的每个实例中是否存在字符?

javascript - jQuery 回车键提交表单

ruby-on-rails - 未定义的方法 `async'(吸盘 gem )

javascript - froala 编辑器在高度大于宽度时旋转图像

javascript - Froala 编辑器 : focus cursor on page load

javascript - 检查类(class)内部或外部的选择

jquery - 如何使 Carousel Bootstrap 3 响应式

ruby-on-rails - 如何使用params.fetch强参数

ruby-on-rails - 如何在 Rails 应用程序中引发错误?

javascript - Froala Wysiwyg - 在自定义下拉列表中添加自定义和工具栏按钮