배포

lee Samse·2024년 7월 2일

react-course

목록 보기
7/8
post-thumbnail

배포판을 만들려면 아래 명령을 실행한다.

npm run build

를 실행하면 build폴더에 배포할 파일들이 생성된다.

기본배포는 domain의 루트에 배치해야 실제 웹서버에서 서비스된다.
domain의 하위 경로에 배포하려면 아래의 순서대로 해야 한다.

  1. package.json에 배포하고자 하는 full path를 지정한다.
{
  "name": "reactjs-challenge-coin",
  "version": "0.1.0",
  "homepage": "https://xxx.github.io/crypto",  // <-- 
  "private": true,
  "dependencies": {
	...
  1. createBrowserRouter에 basename 인자 추가. router를 사용하지 않으면 적용하지 않음.

const router = createBrowserRouter([
    {
        path: "/",
        element: <App />,
        children: [
            {
                path: "coin/:coinId",
                element: <Coin />,
                children: [
                    {
                        path: "price",
                        element: <Price />
                    },
                    {
                        path: "chart",
                        element: <Chart />
                    },
                ]
            },
            {
                path: "/",
                element: <Coins />
            }
        ],
        errorElement: <NotFound />,
    }
], {
    basename: '/crypto' // <-- 여기에 추가
});

export default router;
profile
삼스입니다.

0개의 댓글