[Vite] Failed to load module script: Expected a JavaScript module 오류 해결

오류상황

vite로 React프로젝트 빌드 후 실행했더니 css파일을 못찾으며 아래와 같은 오류가 났다.

 

Failed to load module script: Expected a JavaScript module script but the server responded with a MIME type of "text/html". Strict MIME type checking is enforced for module scripts per HTML spec.

 

해결법

config의 상대경로를 절대경로로 바꾼다. 

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

 

 

원인

vite 는 html파일을 dist폴더로부터 absolute path로 빌드한다.

따라서 프로젝트에서 상대경로를 사용하면, vite에서 dist로부터 절대경로로 사용하는 작업이 잘 안될 수 있다.

vite의 base config option을 확인해보는 게 좋다.

// vite.config.js
export default {
  base: './',
};

 

 

 

참고

https://stackoverflow.com/questions/75433591/failed-to-load-module-script-expected-a-javascript-module-script-but-the-server

Failed to load module script: Expected a JavaScript module script but the server responded with a MIME type of "text/html". Stri