Building vite-plugin-svelte-inspector

Опубликовано: 17 Декабрь 2024
на канале: lihautan
3,589
167

We are going to build a vite-plugin-svelte-inspector, in which you can hover onto any elements and click to jump to the source.

This may seem impossible at first, but, let's break this down, and figure it out together.

We will need to figure a way to find out where the elements are from, then open an endpoint to launch the editor, and then a runtime code to bind the two together, by adding click event listeners to find the element and firing requests to launch the editor.

📚 vite-plugin-vue-inspector https://github.com/webfansplz/vite-pl...
📚 Vite plugin API https://vitejs.dev/guide/api-plugin.html
📚 launch-editor-middleware https://www.npmjs.com/package/launch-...
📚 magic-string https://www.npmjs.com/package/magic-s...
📚 locate-character https://www.npmjs.com/package/locate-...

---

🥰 Support me https://www.buymeacoffee.com/lihautan

🔗 Want to learn more from me? Check out these links:

Twitter:   / lihautan  
Blog: https://lihautan.com/
Newsletter: https://lihautan.com/newsletter
Discord:   / discord  

VS Code Theme: Dracula at night https://marketplace.visualstudio.com/...
ZSH Theme: bullet-train https://github.com/caiogondim/bullet-...

#sveltekit #svelte #sveltekitbeginner #sveltekittutorial

Thanks for watching 🥰 -- with love, Li Hau