Relative Path Note

|-node_modules
|-src
   |-assets 
      |-images 
        |-logo.svg
      |-css
   |-rounter
      |-index.ts
|-views 
   |- HomeView.vue
vite.config.ts
Starting withStart At
<subdriectory>start <subdriectory> and move forward
/ or ./root directory
Example
- 'nodePath': fileURLToPath(new URL('./node_modules', import.meta.url))
../move backward 1 directory level and starts
Example
- import HomeView from '../views/HomeView.vue'
../../move backward 2 directory level and starts there ....

Note many frameworks such as Vue3 define base path such as @ refer to src path in Vite

  • define
resolve: {
      alias: {
        '@': fileURLToPath(new URL('./src', import.meta.url)),
        'nodePath': fileURLToPath(new URL('./node_modules', import.meta.url))
      }
    }
  • using
<img alt="Web logo" class="logo" src="@/assets/images/logo.svg" width="125" height="125" />

Discover more from naiwaen@DebuggingSoft

Subscribe to get the latest posts to your email.