절대 경로, 상대 경로

 

 

1.

./ : 상대 경로 (Relative Path)

현재 파일과 같은 디렉토리 안에 있는 파일 중에서 찾는다.

 

상위 폴더로 가고 싶으면 ../ 를 사용한다.

 

 

2.

@/ : 절대 경로 (Alias - 보통 src/ 를 가리킴)

@는 보통 src/ 디렉토리를 가리키는 Alias (경로 별칭)이다.

 

 

Webpack 이나 Vite, Next.js 등의 빌드 도구에 이렇게 지정해야 한다.

resolve: {
  alias: {
    '@': path.resolve(__dirname, 'src')
  }
}

 

VueClI, Vite, Nuxt.js 는 기본적으로 @가 자동 설정되어 있다.

 

참고로 Nuxt.js는 Vue.js, Node.js, Webpack, Vite 기반의 오픈 소스 JS 라이브러리.

React.js기반의 프레임워크 Next.js 의 영향을 받았다고 한다.