How can I load external jquery file to phoenix framework?

Question

So now I have two external jQuery files, paginate.js and custom.js. And I have installed jQuery through npm install. I tried to load these two files by adding some codes to app.js.

import $ from "jquery"
import paginate from "./paginate";
import custom from "./custom";

but in the console,when I add above codes to app.js, it triggers Uncaught ReferenceError: jQuery is not defined.. I am sure that I installed jQuery successfully as I can write some code with jQuery to test.... Any suggestions for adding those external jQuery files to my phoenix app?? Why it says that Jquery is not defined ??

Thanks in advance.

Answer 1

So I fixed it by adding "jquery" in brunch-config.js

npm: {
enabled: true,
// Whitelist the npm deps to be pulled in as front-end assets.
// All other deps in package.json will be excluded from the bundle.
whitelist: ["phoenix", "phoenix_html", "jquery"]

} };

I didnt have "jquery" in whitelist. After I added it, my jQuery works!