[React / Router] v6 - creatBrowserRouter basename (baseURL) 설정 방법

본문

github repository를 이용해서 배포를 해야할 때가 있다. 그럴 때는 아래와 같이 baseURL을 입력해서 root 주소를 설정해주면 된다.

import React from "react";
import { createBrowserRouter } from "react-router-dom";

import Coin from "./routes/Coin";
import Coins from "./routes/Coins";

const router = createBrowserRouter(
  [
    {
      path: "/",
      element: <Coins />,
    },
    {
      path: "/:coinID",
      element: <Coin />,
    },
  ],
  { basename: "/reactMasterCrypto" }  // 이 부분
);

export default router;

Github

Repository name 과 동일하게 설정하면 된다. 앞에 "/"는 붙여준다.

참고

createBrowserRouter v6.4.5

 

GitHub

[명사] 깃허브((깃이라는 버전관리 시스템을 공유하여 소스코드를 발전시키고자 하는 웹 호스팅 서비스))

GitHub

[Miscellaneous] (Abbr.) GFM.

Github

[Miscellaneous] (Abbr.) JGD.

GitHub

[Miscellaneous] (Abbr.) GLB.

GitHub

[Miscellaneous] (Abbr.) GFM.