DEV Community

Discussion on: Creating Multi-root Vue.js Components

Collapse
 
drozerah profile image
Drozerah
/* paired-cell.js */
import FirstCell from '~/components/paired-cell/first-cell';
import SecondCell from '~/components/paired-cell/second-cell';


`
Hi Kevin ! Could you - like I'm five - explain the use of tilde at the from path when you import your resources ?

Collapse
 
kball profile image
Kevin Ball

Sure. I realized after digging into this, this may actually be a Nuxt-specific thing (I use Nuxt.js for pretty much all my projects) rather than Vue generally, but in Nuxt, '~' is an alias for the root of your project.

Not sure on that, though '~' is often an alias for a similar thing. On linux or mac systems, in the shell '~' refers to your home directory.

So in this context, I'm using the tilde to represent "start from the root of the project, then navigate this directory tree". I prefer this to relative paths for importing, because it means if I move the component (or copy the import code for somewhere else) it will still work.