search

vuejs / repl

Vue SFC REPL as a Vue 3 component
https://repl-vuejs.vercel.app
MIT License
904 stars 159 forks source link

How to import a package locally? And How to use aliases from my vite.config in code? #234

Closed NeilMcEachin closed 3 months ago

NeilMcEachin commented 5 months ago

I'm developing a component library and was hoping to use the repl in my showcase. I added @vue/repl to my project. I now want to import my package into the repl code editor and have it render.

similar to importing GButton here https://repl-vuejs.vercel.app/#eNp9kT1PwzAQhv+K8RKQoBGCqaQVFFV8DICgEouXkF5SF8e27HNbFOW/c3bV0gF1y93znvOc3fE7awerAHzIC185aZF5wGDHQsvWGoesYw5q1rPamZZlFM0O0MMkIBq9x7e4Bo0/tQmuyRsnWyMdZDdCC10Z7ZG1vmGjeOJp9ghKGfZpnJqfZGdCF/lWgH5NBUJrVYlAFWPF4nLcdWm474ucqtSV2gZkq4vWzEGNBCcuOMu3cKemyq8EZ+BR8AiL/OBwfs7Rk1stm8HSG00X0cV5wSvTWqnAvVqU5C74kCUSWUnq6+fUQxfgfNevFlB9/9Nf+k3sCf7mwINbgeB7hqVrgNQinn68wIa+95BWC4rSR+A7eKNCdNzGJkHPSfsgl2yf0ptJ3cz8dIOg/W6pKBqTfcoLTk98f2T1P92rwXWaE7rn/S80iMM8

is there a way to use Import Map to point to a local dependency. Also related is there a way to import by alias and have the repl interpret?

Let me know if there is a better place to ask questions like this

sxzz commented 3 months ago
  1. Export your component via ESM
  2. Ensure the module can be imported via a URL (like http://localhost:5174/your-module.ts)
  3. Add the module to import map

See an example in Vue repo https://github.com/vuejs/core/blob/bbb5be299b500a00e60c757118c846c3b5ddd8e0/packages/sfc-playground/src/vue-dev-proxy.ts#L2