Post Detail

Bagi kalian yang terbiasa menggunakan vuejs adakalanya kita ribet pemanggilan directory yang dimana biasanya kita memanggilanya dengan menggunakan titik titik, contoh seperti ini :

import Header from '../components/Header.vue';
import Footer from '../components/Footer.vue';

Sebetulnya kalo sub directorynya masih dikit masih belum membuat bingung, cuma kalo sub directorynya sudah lumayan banyak nah disanalah akan menemukan sebuah kesulitan. Ada cara supaya kita simple memanggil directory nya, yaitu dengan kita menambahkan alias konfigurasi divuejs, saya menggunakan vuejs + vite ya jadi untuk menambahkan konfigurasi global directorynya ada di file vite.config.js berikut contoh konfig alias directory nya

import { fileURLToPath, URL } from "url";
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [vue()],
  resolve: {
    alias: {
      "@": fileURLToPath(new URL("./src", import.meta.url)),
    },
  },
})

Diatas adalah contoh konfigurasi alias directory dengan pemanggilan alias adalah @ atau A keong yang dimana di arahkan ke folder src, nah dengan kode diatas maka sangat simple ketika kita mau memanggilnya di component misalnya, contoh pemanggilan dengan global directory yang semua pakai titik titik maka akan menjadi seperti ini:

    import Header from '@/components/Header.vue';
    import Footer from '@/components/Footer.vue';

Demikianlah artikel pendeknya, semoga bermanfaat buat kalian-kalian yang sedang belajar vuejs.