通过 Webpack 在 Rails 中安装 jQuery 时未定义 $

2024-04-04

我正在尝试通过 Webpack 在 Rails 6.0.0.rc1 中安装 jQuery,我不确定我缺少什么,但我收到了错误$ is not defined尽管能够编译 jQuery,但仍会在浏览器控制台中出现。

我添加了 jQueryyarn add jquery,所以我的 package.json 看起来像这样

{
  "name": "muladeseis_app",
  "private": true,
  "dependencies": {
    "@babel/preset-react": "^7.0.0",
    "@rails/actioncable": "^6.0.0-alpha",
    "@rails/activestorage": "^6.0.0-alpha",
    "@rails/ujs": "^6.0.0-alpha",
    "@rails/webpacker": "^4.0.2",
    "babel-plugin-transform-react-remove-prop-types": "^0.4.24",
    "jquery": "^3.4.0",
    "prop-types": "^15.7.2",
    "react": "^16.8.6",
    "react-dom": "^16.8.6",
    "turbolinks": "^5.2.0"
  },
  "version": "0.1.0",
  "devDependencies": {
    "webpack-dev-server": "^3.3.1"
  }
} 

我的 app/javascript/packs/application.js 需要来自 node_modules 的 jquery

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

我尝试过注册$在 config/webpack/environment.js 中执行以下操作:

const { environment } = require('@rails/webpacker')

const webpack = require('webpack')

module.exports = environment

environment.plugins.append(
    'Provide',
    new webpack.ProvidePlugin({
        $: 'jquery',
        jQuery: 'jquery'
    })
)

每当我在我的视图中添加一个脚本时$我得到的参考Uncaught ReferenceError: $ is not defined.

我已经检查过 StackOverflow 的答案,例如this https://stackoverflow.com/questions/37651015/webpack-using-bootstrap-jquery-is-not-defined看看我是否错误地注册了关键字符“$”,但我只找到了建议使用我已经在配置中提到的 ProvidePlugin 的答案。

另外,如果我在浏览器检查器中探索我的应用程序源,我确实会看到 jQuery 代码集成在 localhost:3000 >> packs/js 中,所以问题不是 Webpack 找不到 jQuery,而是关键字 '$' 和 'jQuery' 是不被认可。

我很感激你帮助调试这个。


我已经得到了缺少的东西。

In app/javascript/packs/application.js忘记声明:

window.jQuery = $;
window.$ = $;

所以可以选择 jQuery 关键字。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

通过 Webpack 在 Rails 中安装 jQuery 时未定义 $ 的相关文章

  • ASP.NET MVC 用户名可用性检查

    我已经阅读了很多分步教程 但仍然无法让我的代码工作 我浏览了这个网站上的解决方案 但也没有运气 我不知道我做错了什么 我正在使用 jQuery 想知道用户名 mark 是否被占用 我什至还没有达到数据库链接 HTML
  • jQuery Datatables 分页中如何返回特定页面?

    我在每一行都有一个数据表和 编辑 按钮 当我单击该按钮时 edit url 将打开 到目前为止一切都很好 但如果我需要返回数据表 则从第一页开始 我能为此做些什么呢 table dataTable sDom rtFip gt fnDrawC
  • JQuery 可拖动图像并保存位置

    好吧 这变得很尴尬 已经搜索并尝试了大约 5 个小时 但我只是在兜圈子 场景很简单 它是用户个人资料的标题图像 可以将其拖动到某个位置 然后将图像的顶部位置保存到数据库中 感谢 Beetroot Beetroot 的 遏制 父级 我开始关注
  • 如何在文本字段内设置用户名和密码的标签?

    我的网站有一个登录表单 该登录表单有两个文本字段 用户名和密码 目前 我将标签 用户名 密码 放置在文本字段之前 但现在我想删除这两个标签并想在文本字段内显示文本 用户名 密码 当用户关注这些文本字段时 文本应该被删除 用户可以输入他想要的
  • jQuery 对表列重新排序

    我找到了适用于行的各种解决方案 以及适用于普通表列的各种解决方案 但我需要一个允许我拖放 colspan gt 1 的列标题的解决方案 例如 table thead tr th A1 th th A2 th th A4 th th A5 t
  • Jquery - 限制文本输入中的文本,而不是文本区域

    使用 jquery 如何限制可以在文本字段中输入的字符数 不是指文本区域 只是一个普通的文本输入字段 我有一个表单 并通过 iPad 使用 IOS5 进行查看 由于某种原因 maxlength 属性被忽略 如果我使用 maxlength 1
  • 显示 am4charts.XYChart 中的所有工具提示

    大家好 我正在使用 am4charts XYChart 来显示两个不同供应商的价格 该图表工作正常 并且仅当我们将光标悬停在图表中的点上时 每个点的工具提示才可见 但是我的要求是在渲染图表时应显示图表中所有点的工具提示 它应该一直显示而不悬
  • 根据纬度和经度识别哪个是多边形

    我有一张使用 leaflet js 绘制的地图 如果我给出经度和纬度值作为输入 我可以识别多边形吗 我可以获得一个客户端脚本吗 得到答复如下 这是基于 多边形中的点算法 function getPoint float x 89 824218
  • 如何使用 OR 逻辑(而不是 AND)过滤表列

    小提琴示例 http jsfiddle net fks37 我有一个 html 表 A B C D 0 1 0 1 0 1 0 0 1 0 0 1 我要过滤non zero列 使用 jQuery dataTables 不是硬性要求 只是我当
  • 如何全局公开 es6 模块

    我需要编写一个可在全局窗口上使用的模块 我使用 es6 创建模块 我定义的每个类都有它自己的文件 我正在使用 webpack 来 babelify 并捆绑这些类 我的模块的入口点也是包含要公开的全局的文件 我尝试了各种方法来实现这一点 包括
  • 我无法让 jQuery 工作 [关闭]

    很难说出这里问的是什么 这个问题是含糊的 模糊的 不完整的 过于宽泛的或修辞性的 无法以目前的形式得到合理的回答 如需帮助澄清此问题以便重新打开 访问帮助中心 help reopen questions 你好 我正在尝试一些 jQuery
  • 通过排队预加载图像?

    我正在寻找一种预加载特定图像并将其添加到队列中的方法 这是我目前所处的位置 http shivimpanim org testsite imageloader html http shivimpanim org testsite image
  • 如何找到 Rails 中的当前路线?

    我需要知道 Rails 中过滤器中的当前路线 我怎样才能知道它是什么 我正在处理 REST 资源 但没有看到命名路由 如果您尝试对视图中的某些内容进行特殊处理 您可以使用current page as in 或者一个动作和ID 或命名路线
  • 提交登录表单后关闭 Fancybox 模式窗口并重新加载页面

    我在 FancyBox 2 模式 iframe 窗口中打开了一个登录表单 但是 当您提交表单时 网页将在模式中打开 谁能告诉我是否以及如何使 Fancybox 模式关闭 并在提交登录表单时重新加载底层页面 这是我当前的代码 在functio
  • jQuery 函数在不应该运行的时候运行

    我有一个函数 仅当宽度小于特定值时才需要运行 我已经这样做了if window width lt n 但当宽度大于 n 时 该函数也会运行 The if if window width lt n 由于背景颜色发生变化 浅灰色 1000px
  • 如何在没有 Web 服务器的情况下运行 ajax 代码?

    我在系统上没有服务器的情况下运行ajax 我用它创建了一个index html JavaScript 函数 function do the click url alert inside this method do the click aj
  • 强制上下文

    我有一个类 其中有一个私有属性和一个公共访问方法 Person function this Name asd var public new Object public Name function value if value undefin
  • 带设计的嵌套形式

    这是我的注册表单 p br p p br p p br p
  • ActionDispatch::Http::UploadedFile.content_type 在 Rspec 测试中未初始化

    背景 我有一个Book模型与一个cover file通过我的 Rails 控制器之一使用上传的文件设置的属性 我正在使用 Rails v4 0 4 Goal 我想测试是否仅保存具有特定内容类型的文件 我计划创建 Rspec 测试示例Acti
  • 如何从 Selectize 中删除项目?

    有什么方法可以从 Selectize 中删除项目吗 这是我的示例列表 AMNT QTY NA 当我经过时NA它应该删除特定项目 fn removeSelectorValue function value var selectize this

随机推荐