为什么 importmaps 命令生成的源不适用于 Bootstrap 4.6.1,但同一版本的 jquery 的修改源可以工作?
我使用 importmaps 创建了一个 Rails 7 应用程序来管理 javascript。
我手动将旧版本的 Bootstrap (4.6.1) 固定在importmap.rb
当我运行
bin/importmap pin jquery以下内容时,会添加到importmap.rb
pin "jquery", to: "https://ga.jspm.io/npm:jquery@3.6.0/dist/jquery.js"
Run Code Online (Sandbox Code Playgroud)
加载网站并查看 Chrome Web Tools 会显示此错误消息,并且下拉菜单和手风琴等 jquery 功能不起作用
Uncaught TypeError: Bootstrap's JavaScript requires jQuery. jQuery must be included before Bootstrap's JavaScript.
at Object.jQueryDetection (bootstrap.min.js:6:2464)
Run Code Online (Sandbox Code Playgroud)
importmap.rb但是,当我手动更新 jquery 源时
pin "jquery", to: "https://ga.jspm.io/npm:jquery@3.6.0/jquery.js"
Run Code Online (Sandbox Code Playgroud)
错误消息已解决并且功能已恢复。
在我看来,来源几乎相同,它们都是 jquery 3.6.0
https://ga.jspm.io/npm:jquery@3.6.0/dist/jquery.js
Run Code Online (Sandbox Code Playgroud)
https://ga.jspm.io/npm:jquery@3.6.0/jquery.js
Run Code Online (Sandbox Code Playgroud)
application.js
// Configure your import map in config/importmap.rb. Read more: https://github.com/rails/importmap-rails …Run Code Online (Sandbox Code Playgroud) jquery ruby-on-rails bootstrap-4 import-maps ruby-on-rails-7
我有一个新的 Rails 7 应用程序,它使用importmap-railsgem 来管理 javascript 前端库。
我正在尝试使用 Semantic-UI 库,但 Semantic-UI javascript 无法识别 jQuery 的依赖项。
我无法通过 importmap 固定 Semantic-UI 库,所以我手动添加了这个库importmap.rb。这是我正在使用的semantic.min.js 的cdn 链接。
Chrome Web Tools 的控制台中出现以下错误消息,并且我在页面上验证 JavaScript 的可折叠折叠面板无法正常工作。
Uncaught ReferenceError: jQuery is not defined
at semantic.min.js:11:6043
(anonymous) @ semantic.min.js:11
Run Code Online (Sandbox Code Playgroud)
被引用的行semantic.min.js看起来像这样
(jQuery,window,document)
Run Code Online (Sandbox Code Playgroud)
我认为 Semantic-UI 和 jQuery 导入发生的顺序可能是问题所在(根据许多其他Stack Overflow 问题和Github 问题)。
但是,我在 Semantic-UI 导入之前进行了 jQuery 导入。
如果我注释掉 Semantic-UI 导入,我就可以毫无问题地使用 jQuery。
我已切换文件preload上的变量importmap.rb 以查看 Semantic-UI …