时间戳

首页 > 解决方案 > Phoenix Framework - jQuery connection

elixir - Phoenix Framework - jQuery connection

问题描述

I have problem with jquery connection to my Project on the Phoenix Framework. I have installed jQuery through npm install

npm i jquery

I add import to app.js.

import $ from 'jquery'

My dependencies at package.json

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

But in console I have error

Uncaught ReferenceError: $ is not defined

My js

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

Please, help me.

标签： elixirphoenix-frameworkphoenix

解决方案

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

const webpack = require('webpack');

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

和 assets/js/app.js

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

推荐阅读