절대 경로 잡아줬는데 vue 파일 대신 vue.js 파일 찾을때(Vue3 + Typescript +Vite)

먼저 다음과 같이 vite.config.ts에서 절대 경로를 잡아준다.

  resolve: {
    alias: {
      "@": fileURLToPath(new URL("./src", import.meta.url)),
      "@components": fileURLToPath(
        new URL("./src/components", import.meta.url)
      ),
    },
  },

tsconfig.json 또는 tsconfig.app.json에도 다음과 같이 동일하게 경로를 잡아준다.

"compilerOptions": {
    "composite": true,
    "baseUrl": ".",
    "paths": {
      "@/*": ["./src/*"],
      "@components/*": ["./src/components/*"]
    }
  }

그리고 import를 통해 경로를 찾으려 하지만 다음과 같은 오류가 발생한다 Could not find a declaration file for module '예시경로/MainHeader.vue'. '예시경로/MainHeader.vue.js' implicitly has an 'any' type.ts(7016)

vue 파일을 연결했지만, vue.js를 찾는다. typescript 환경에서는 <script setup lang="ts">와 같이 lang="ts"를 설정해줘야지 js 경로를 인식한다. 호출단과 호출되는 파일 모두에 lang 설정을 함으로써 해결할 수 있다.