如何在 Rails 6.0.3.3 中使用 jQuery？
Posted
技术标签:
【中文标题】如何在 Rails 6.0.3.3 中使用 jQuery？【英文标题】：How do I use jQuery in Rails 6.0.3.3? 【发布时间】：2021-01-19 01:18:07 【问题描述】：运行 Rails 6.0.3.3 并且无法让 jQuery 工作。
这里是 packs/application.js
require("@rails/ujs").start()
require("turbolinks").start()
require("@rails/activestorage").start()
require("channels")
在我看来，我有这样的事情：
<head>
<%= javascript_pack_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
</head>
<div id="pop">
TEST
</div>
<script>
$(document).ready(function()
$('#pop').hide();
);
</script>
因此，当我的页面加载时，我希望显示“TEST”的#pop div 不会显示。似乎这种设置不起作用。想法？
【问题讨论】：
【参考方案1】：Rails 6 默认不包含 JQuery。你好像没有安装它。
这是一个link，它展示了 Webpack 的工作原理以及如何使用 Rails 6 安装 JQuery。
但如果只是想安装 JQuery，这里是如何做到的：
在您的项目中运行yarn add jquery。
请务必检查您的 package.json 和 yarn.json 是否已成功安装 JQuery，其中 JQuery 包应可见。
然后在你的environment.js中添加这个sn-p：
environment.plugins.prepend('Provide',
new webpack.ProvidePlugin(
$: 'jquery/src/jquery',
jQuery: 'jquery/src/jquery'
)
)
您的environment.js 应如下所示：
const environment = require("@rails/webpacker");
const webpack = require("webpack");
environment.plugins.append(
"Provide",
new webpack.ProvidePlugin(
$: "jquery/src/jquery",
jQuery: "jquery/src/jquery",
)
);
module.exports = environment;
现在只需在您的application.js 中添加require('jquery')。
application.js文件：
require("@rails/ujs").start()
require("turbolinks").start()
require("@rails/activestorage").start()
require("channels")
require("jquery")
【讨论】：
谢谢。现在试试这个。遇到一个问题，你说的这个 environment.js 文件在哪里？ 谢谢。现在试试这个。我能够将该代码粘贴到 environment.js 和 application.js 文件中，但它仍然无法正常工作:(还有其他想法吗？ 您是否通过运行yarn add jquery 安装了jquery？如果您收到任何错误消息，请检查开发工具的控制台。以上是关于如何在 Rails 6.0.3.3 中使用 jQuery？的主要内容，如果未能解决你的问题，请参考以下文章
如何在 Webpacker 中使用 Rails Url 助手/Rails 5.1 中的 React-rails