Using Uncaught ReferenceError: $ is not defined

Question

在我的 Rails 6 项目中，我一直在尝试使用资产管道让 application.js 使用 jQuery 和 [=12 处的 JavaScript 文件=]，但两者都不起作用。当我加载我的网页时，我得到一个 Uncaught ReferenceError: $ is not defined，而当我点击某些东西时，我的 JavaScript 代码没有做任何事情。

我尝试过的事情：

this Whosebug question 的最佳答案建议我只需编写 //=require events_index 即可获得 events_index.js，但这没有任何作用
我没有意识到我的 //= require 行必须在 header 中。当我改变它时，它仍然没有帮助
我运行gem 'jquery-rails'
我之前用的是$(document).ready()，但是显然因为Rails 6使用了TurboLinks，这个不行了，所以我改了

这是我的 application.js 文件的全文：

// This file is automatically compiled by Webpack, along with any other files
// present in this directory. You're encouraged to place your actual application logic in
// a relevant structure within app/javascript and only use these pack files to reference
// that code so it'll be compiled.

//= require jquery
//= require jquery_ujs
//= require bootstrap
//= require events_index

require("@rails/ujs").start()
require("turbolinks").start()
require("@rails/activestorage").start()
require("channels")

// Uncomment to copy all static images under ../images to the output folder and reference
// them with the image_pack_tag helper in views (e.g <%= image_pack_tag 'rails.png' %>)
// or the `imagePath` JavaScript helper below.
//
// const images = require.context('../images', true)
// const imagePath = (name) => images(name, true)

$( document ).on('turbolinks:load', function() {
    console.log( "ready!" );
});

感谢您的帮助！

Answer 1

Rails 6 默认带有 webpacker，您应该通过 yarn add load it via webpacker 安装 jquery。参见 How to add jquery third party plugin in rails 6 webpacker

Using Uncaught ReferenceError: $ is not defined

Using Uncaught ReferenceError: $ is not defined

javascript

jquery

ruby-on-rails

asset-pipeline