活动管理界面因浏览器控制台中的错误“未捕获的引用错误：$未定义”而损坏

Question

我使用 Active Admin 作为管理后端运行 Ruby on Rails 应用程序。 我的设置是： 红宝石2.5.9 轨道 5.2.8.1 活动管理2.9.0 Webpacker 4.3.0

我从较旧的虚拟机迁移了应用程序并更新了一些底层技术，导致界面有些破损。

现在，在管理后端的大多数视图中，我在浏览器控制台中收到以下错误：

base.js:18 Uncaught ReferenceError: $ is not defined
    at base.js:18:3
    at Object.<anonymous> (base.js:14:66)
    at i (bootstrap:19:22)
    at Module.<anonymous> (active_admin.js:1:1)
    at i (bootstrap:19:22)
    at bootstrap:83:10
    at active_admin-d8e2e3d…0e9be08c9d.js:2:921
(anonym)    @   base.js:18
(anonym)    @   base.js:14
i   @   bootstrap:19
(anonym)    @   active_admin.js:1
i   @   bootstrap:19
(anonym)    @   bootstrap:83
(anonym)    @   active_admin-d8e2e3d….js:2

我尝试以下步骤来解决该问题：

1. 我跑了

   bundle exec rails generate active_admin:assets --use_webpacker

2. 我将此行添加到我的

   config/initializers/active_admin.rb

config.use_webpacker = true

3. 我跑了

   rails g active_admin:webpacker

我从 activeadmin github 存储库中的一个问题中得到了这些步骤： https://github.com/activeadmin/activeadmin/issues/309

我也已经检查过类似的问题，但这里似乎没有任何帮助。

有人可以帮我解决这个问题吗？我认为，我的 Rails 应用程序中的其他问题也导致了这个问题。

提前致谢并致以诚挚的问候

编辑：

由于我无法在评论中格式化代码，因此我在此处添加对 @engineersmnky 评论的答案：

在

app/assets/javascripts/active_adminjs

中我添加了第一行：

//= require jquery
//= require active_admin/base

另外在我的

application.js

中有这些行：

//= require jquery
//= require rails-ujs
//= require activestorage
//= require turbolinks
//= require_tree .

我还认为，这应该使 jquery 全局可用，这是我的

config/webpack/plugins/jquery.js

const webpack = require('webpack')

module.exports = new webpack.ProvidePlugin({
  "$":"jquery",
  "jQuery":"jquery",
  "window.jQuery":"jquery"
});

Answer 1

解决方案比我想象的要简单......

问题是我的另一个 Rails Gem 处理 webpacker 的方式干扰了 webpacker 模式下的 ActiveAdmin。所以我必须使用 Sprockets 运行 ActiveAdmin，这是默认设置，并且错误消失了。

感谢所有提供帮助的人。