Open kyh012412 opened 6 months ago
https://kyh012412.github.io/react_side_project1/ 이쪽으로 연결되도록 package.json에 homepage를 연결했고
스크립트도 다음과 같이 predeploy와 deploy를 추가했다.
뭐가 부족한지 정상 작동이 되지 않는 문제가 있다. app.js
app.js
import './App.css'; import { BrowserRouter, Route, Routes } from 'react-router-dom'; import Nav from './component/Nav'; import Collapse from './component/Collapse'; import Carousel from './component/Carousel'; import Dropdown from './component/Dropdown'; import Navbar from './component/Navbar'; import './css/mytemplate.css'; import CardInGame from './component/CardInGame'; import BoardInGame from './component/BoardInGame'; import IsOutsideInfoComeLater from './component/IsOutsideInfoComeLater'; import FetchTest from './component/FetchTest'; import CollapseButton from './component/CollapseButton'; import CollapseBody from './component/CollapseBody'; import { IdContext } from './context/IdContext'; import CollapseSet from './component/CollapseSet'; function App() { return ( <> {/* 12시방향 가로로 긴 직사각형 */} <div className="header"> <Navbar id={'topNavbar'} /> </div> {/* 상중하중에 중간에 뚱뚱한 가로로 긴 직사각형 */} <div className="middle"> <div className="middle-left"> <IdContext.Provider value="leftNavCollapseBody"> <CollapseSet /> </IdContext.Provider> </div> <div className="middle-center" id="Content"> {/* <BoardInGame jsonPath="/cardData.json" /> */} <BrowserRouter basename={process.env.PUBLIC_URL}> <Routes> <Route path={process.env.PUBLIC_URL} element={<></>} /> <Route path="/collapse" element={<Collapse />} /> <Route path="/carousel" element={<Carousel />} /> <Route path="/dropdowns" element={<Dropdown />} /> <Route path="/card" element={ <CardInGame name="asset0" imagePath="/img/card/asset0.svg" /> } /> <Route path="/board" element={<BoardInGame jsonPath="/cardData.json" />} /> <Route path="/isout" element={<IsOutsideInfoComeLater />} /> <Route path="/fetchtest" element={<FetchTest />} /> </Routes> </BrowserRouter> </div> <div className="middle-right"></div> </div> {/* 상중하 중에 아래부분 가로로 긴 직사각형 */} <div className="footer"></div> </> ); } export default App;
또는
<BrowserRouter basename="/react_side_project1"> <Routes> <Route path="/" element={<></>} /> <Route path="/collapse" element={<Collapse />} /> <Route path="/carousel" element={<Carousel />} /> <Route path="/dropdowns" element={<Dropdown />} /> <Route path="/card" element={ <CardInGame name="asset0" imagePath="/img/card/asset0.svg" /> } /> <Route path="/board" element={<BoardInGame jsonPath="/cardData.json" />} /> <Route path="/isout" element={<IsOutsideInfoComeLater />} /> <Route path="/fetchtest" element={<FetchTest />} /> </Routes> </BrowserRouter>
kyh012412.github.io에 배포를하는것으로하고 homepage도 https://kyh012412.github.io로 맞춰주고 basename에는 process.env.PUBLIC_URL로 맞춰주어서 임시적으로 해결하였다. 여러개의 repo를 동시에 서비스 받으려면 더 구체적인 해결책이 필요해보인다.
https://kyh012412.github.io/react_side_project1/ 이쪽으로 연결되도록 package.json에 homepage를 연결했고
뭐가 부족한지 정상 작동이 되지 않는 문제가 있다.
app.js
또는