Aliases in Nuxt 3 (+ raffle 🎁)
Вставка
- Опубліковано 9 лип 2024
- 💻 Relative paths are common when importing files (if you have to). But especially when moving the containing file around, updating paths can be tedious. Luckily, Nuxt gives us the option to create aliases for often used folders and even provides own ones! In this video, you'll figure out which are there, the caveats (aka when to NOT us them) and how to customize them.
Key points:
⌨️ Which aliases are there by default
✨ How to create own aliases
🚨 When not to use them
Links:
🔗 Docs - nuxt.com/docs/api/nuxt-config...
🔗 Improved directory structure Issue github.com/nuxt/nuxt/issues/2...
📺 Testing in Nuxt - • Nuxt Test Utils - A Pr...
📺 Auto Imports - • Nuxt 3 Auto Imports - ...
📺 Nuxt Layers - • How to use Nuxt Layers...
📺 Daniel Roe on Nuxt aliases - • Using aliases with Nuxt
Don't forget to hit that "Subscribe" button, ring the notification bell and give a thumbs up!
🌐 Connect further:
Website: www.lichter.io
Twitter/X: / thealexlichter
Twitch: / thealexlichter
Chapters:
00:00 Intro
00:37 VueConf US Raffle
01:10 Intro to aliases
01:38 Demo app and scenario
03:16 Using file aliases like @ or ~
04:57 The @@ and ~~ aliases with a source directory
06:35 Adding custom aliases
07:57 Hash imports such as #imports
08:39 Alias gotchas
12:22 DejaVue + Outro - Наука та технологія
I spoke at VueConf in 2019. Since then the pandemic, helping my 85 and 86 year old parents and basically life has grown in the way of my attending the conference since I spoke. I turned 62 last week and I am in the process of winding down my career as a software developer and I would like to attend for one last hurrah. And I would love to eat some beignets while listening to jazz.
As always, great video!! I'd also like a video about proxying external api to overcome CORS. Also, the topic of formating and linting in nuxt 3 would be great!
ua-cam.com/video/J4E5uYz5AY8/v-deo.html
Thanks a lot!
I’ve made a video on proxying @ ua-cam.com/video/J4E5uYz5AY8/v-deo.html already which should cover that ☺️
Linting is on the list!
Would love to see something similar axios interceptor config for centralised header configuration, which will work both SSR and client as well.
Noted ✅
Hey Alex, could you do a video regarding functional component and when to use them?
Love ur content Alex ❤
U deserve a much larger audience, keep up the energy 🎉
(Not a resident of US, please don't count my ID ❤)
So much appreciated 🙏🏻🙏🏻
Hope more people will be aware! Sharing helps a lot there ☺️
Nice video!
Is there a way to use aliases inside a Docker container? Problem I have is that Nuxt, which lives inside the container works fine, but VSCode which lives outside the container complains that the paths could not be found.
Man you're the best, make more videos!
Trying my best 🙌 One Video every Friday, a @DejaVue podcast episode every Thursday ✨
Thanks for your videos man, amazing job!
Glad you like them!🙌🏻
Would love to go to the vuejs conf, as I'm a vuejs lover since last year October when i was introduced, wince then I have never stopped using it...I have now started to use learn Nuxtjs and is loving it, I like the fact that it easy to prototype a idea that I have and it has save so much time push out a project in product. Thanks for another great video and keep up the good work
aw man, I'll be in the US in June/July so can't make it. Does anyone know if there are similar Vue events somewhere in the US during June/July/maybe August?
Check out meetups around the US, e.g. Atlanta Vue.js or VueNYX - or some more "general JS/Frontend" meetups like JS KC, all depending on your location. Also there should be a few general JS conferences around that time, e.g. CascadiaJS
Perfect man. 👍
Thanks! 🙏🏻
Very good and useful content as usual in your channel. Thank you. Would be nice to see more examples about fetching data in SSR and CSR, some real world scenarios.
Thank you for your time creating this content for all of us 🤝👍
Great suggestion, will see how to wrap that nicely in a video!
@@TheAlexLichter why did you stop streaming live? I hope we will see it soon 🤓
@tomasbirbalas4744 due to the lack of time 🙈 but I will actually stream again today! 😁
@@TheAlexLichter Where can I find it? I would like to attend the live stream if possible. :)
On twitch.tv/TheAlexLichter
Moved over to streaming tomorrow though
Great video!!
Does aliases work the same in regular vue.js 3 (not nuxt) ?
Almost but you have to define them yourself via the vite config
🎁
🎉
Love ur videos 🎉❤
Yay! Thank you! 🙏🏻
What about import from server folder?
anything in "server" is ideally only imported/used there. But there are some exceptions of course 😋
These aliases might need to be defined through `nitro.alias`
I wish I could come to VueConf, but I have exams those days... This college!!!
Oh noo :/ but best of success for the exams!
@@TheAlexLichter thanks!! Will look forward to more conferences in the future.
Alexander - I've got a pretty amazing content management system I'd love to show you and the crew at vue conf over some tequila :)
Let’s do that 🙌🏻
🎁