Phoenix Framework-jQuery连接

2024-05-16 • 问答

我在Phoenix框架上将jQuery连接到我的项目时遇到问题。我已经通过npm install

安装了jQuery。

npm i jquery

我将导入添加到app.js。

import $ from 'jquery'

我对package.json的依赖

"jquery": "^3.4.1","phoenix": "file:../deps/phoenix","phoenix_html": "file:../deps/phoenix_html"

但是在控制台中我有错误

未捕获的ReferenceError：未定义$

我的js

<script>
    $("#login-btn").click(function(){
        console.log("Sign in button pressed");
    });
</script>

请帮帮我。

当您导入jQuery时，它仅在该模块中可用。它不会自动设置在窗口对象上，该窗口对象是在该script标签中进行搜索的地方。

我不确定这是否是一个好习惯，但是在您的特定情况下，您可以尝试执行以下操作：

import {$,jQuery} from 'jquery';

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

您需要将此行添加到assets / webpack.config.js

const webpack = require('webpack');

plugins: [
  new webpack.ProvidePlugin({
    $: "jquery",jQuery: "jquery"
  })
]

和资产/js/app.js

import $ from 'jquery'
window.jQuery = $
window.$ = $

本文链接：https://www.f2er.com/3158407.html