ElMassimo / iles

🏝 The joyful site generator
https://iles.pages.dev
MIT License
1.06k stars 31 forks source link

Importing scripts into Iles #272

Closed R0N1n-dev closed 3 months ago

R0N1n-dev commented 4 months ago

Description 📖

Cannot get script through cdn Have been having an issue trying to intergrate Vue Ui libraries especially the ones which contain JS (like Vuesax-alpha, Inkline, WaveuI) into iles. Using cdn, css comes through but the scripts don't

Reproduction 🐞

https://stackblitz.com/github/R0N1n-dev/iles-pwa

Dependencies Info _Run `npx iles info` and `pnpm list` (or `npm list`) and provide the output:_ ``` iles v0.9.5 vite v4.4.4 ```

Logs 📜

If not providing a reproduction:

Output _Run `DEBUG=iles:* npm run dev` or `DEBUG=iles:* npm run build` and provide the output:_ ``` ```

Screenshot from 2024-03-19 16-27-26

The 'Button' should look like this Screenshot from 2024-03-19 16-27-56

TechAkayy commented 3 months ago

Hi there,

I tried using inkline on a normal Vue project on stackblitz, and I'm seeing some odd errors with their cdn js script. And I tried in your iles repo as well, same error. This looks like an issue with Inkline rather than with Vue/Iles. Best to raise this bug with them.

Also, their documentation does cover using inkline as a Vite plugin, so that the components can be auto-imported and tree-shaken. Any reason why you are using that way? Iles uses Vite underneath, any Vite plugins can be added to iles.config.ts under a vite property (https://iles.pages.dev/config#configuring-vite)

https://stackblitz.com/edit/vitejs-vite-fpykgf?file=index.html

image
TechAkayy commented 3 months ago

Also in your reproduction, if you check console, you will notice that the inkline cdn script & css are added the head as expected. So, extending the head via app.js is working the Iles way. If you check the console, you will notice the same error as above in your iles repo too.

Also, I believe when you use cdn, you will have to stick to kebabcase for components. But, I would recommend you to configure inkline the Vite way as per their docs.

image
R0N1n-dev commented 3 months ago

Alright. Thanx