Add Semantic-UI with jQuery components

myelement88
0
myelement88
commented 16 days ago

Hello,

I'm trying to add Semantic-UI JS and jQuery via build script.

So far I was only able to add it via CDN. But the goal would be to add it via nuxt.config.js:

const pkg = require("./package"); const jqueryCDN = "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"; const suiCDN = "https://cdn.jsdelivr.net/npm/[email protected]/dist/semantic.min.js"; import webpack from "webpack";
module.exports = { mode: "universal", head: { title: "Nuxt App", meta: [ { charset: "utf-8" }, { name: "viewport", content: "width=device-width, initial-scale=1" }, { hid: "description", name: "description", content: "pkg.description" } ], link: [{ rel: "icon", type: "image/x-icon", href: "/favicon.ico" }], script: [{ src: jqueryCDN }, { src: suiCDN }] }, loading: { color: "#0082b9" }, css: [ // Loads main style "~/assets/semantic/semantic.css", "~/assets/styles/main.css" ], modules: [], plugins: [], build: { // Jquery config over webpack plugins: new webpack.ProvidePlugin({ jQuery: "jQuery", $: "jQuery", "window.jQuery": "jQuery" }) } };

If I try to add Semantic-UI and jQuery via Plugins (node_modules):
{ src: "jquery" ssr: false } { src: "fomantic-ui" ssr: false }

I always get jQuery is Not Defined.

And of course i've studied the docs and the implementation of axios but that doesnt seem to work either.

Some help would be highly appreciated. Thanks in advance.

0
Informations
Question โ€ข Unresolved
#c7 - Created 16 days ago