Create custom-elements with Stencil and use in JS app

[arpansaha13]

[netlify[bot]]

✅ Deploy Preview for frontend-mini-challenges ready!

Name	Link
🔨 Latest commit	28b25d7552794ab661768a3ad705487360109539
🔍 Latest deploy log	https://app.netlify.com/sites/frontend-mini-challenges/deploys/657e7decf84f7d0008c46e60
😎 Deploy Preview	https://deploy-preview-348--frontend-mini-challenges.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[sadanandpai]

local dev is breaking with npm run dev. The dist has to be generated to make it work.

[arpansaha13]

Oh yes the stencil build needs to happen. May be if we add that command in the script before running dev 🤔

[arpansaha13]

This one will work if we run dev at the root. But if we run in individual workspace, then again the error will be there, if stencil is not already built.

[sadanandpai]

[arpansaha13]

What to do here ?

[sadanandpai]

The netlify build is breaking with the changes.

[arpansaha13]

The "build-baseless" command was not made for stencil.

I tried doing it like the "build" command by adding "build-baseless" in stencil folder. But nx will run javascript and stencil build in parallel. So js build will fail again because stencil needs to build before js.

If we could configure nx so that it does not run js and stencil together, then this problem could be solve. But I couldn't find this in docs. So I edited the root scripts for now.

[sadanandpai]

is this intentional

[arpansaha13]

The back link or the design?

[sadanandpai]

yes

[arpansaha13]

The design was intentional because some titles are very long resulting in overflow.

The back link is currently pointing to home page instead of challenge list page... this was not intentional... will fix

[arpansaha13]

Mobile:

Desktop: