0. 사건의 발발
기존에 레거시 프로젝트를 모노레포 프로젝트에 맞게 리팩토링 하는 작업을 수행했다.
이때 /hidelogin_q.asp?params=… 형태의 서버 사이드 스크립트 방식 잔재가 남아있었는데
PC 프로그램에서 이 url을 사용하기 때문에 리팩토링 프로젝트에서도 기존 url을 수용해야했다.
처음에는 단순히 dot url을 추가하면 될줄 알았으나…(불긴한 예감은 항상 틀리지 않지요ㅜ)
개발서버에서 페이지를 찾을 수 없다는 404 응답이 돌아왔다………
1. 문제가 발생한 이유
vite dev server에서 dot url을 SPA의 entry point인 index.html로 서빙하지 않고,
직접 파일요청으로 인식했기 때문이다.
이를 해결하기 위해 vite config에 플러그인 추가를 해야한다는걸 깨달았다.
(운영서버에서는 /hidelogin_q.asp에 대한 서빙처리가 되어있기 때문에 잘 작동한다.)
2. 해결
2-1. vite-plugin-rewrite-all
dot url에 대한 해결책을 검색했더니
vite-plugin-rewrite-all라는 라이브러리를 사용하라는 글을 보게 되었고, 이를 통해 해결이 되었다.
하지만, 대체 이게 무슨짓을 했길래 dot url이 작동하는걸까 하는 궁금함에 이 라이브러리를 살펴보니 아래와 같이 되어있었다.
// <https://github.com/ivesia/vite-plugin-rewrite-all/blob/master/src/index.ts>
import {ViteDevServer} from "vite";
import history from "connect-history-api-fallback";
import {Request, Response} from "express-serve-static-core";
export default function redirectAll() {
return {
name: "rewrite-all",
configureServer(server:ViteDevServer) {
return () => {
const handler = history({
disableDotRule: true,
rewrites: [{from: /\\/$/, to: () => "/index.html"}]
});
server.middlewares.use((req, res, next) => {
handler(req as Request, res as Response, next)
});
};
}
}
};