728x90
오랜만에 수정할 것이 있어서 Vue.js 프로젝트를 열고 열심히 코딩.
yarn serve 로 즐겁게 기능 구현 완료하고 yarn build 로 빌드했는데 그 결과파일(dist/index.html)이 동작하지 않고 하얀 화면만 나왔다.
npm run build 도 같은 증상 확인.
잘만 되던게 안되는게 이상해서 찾아보니 index.html 에서 '/' 때문이라더라
아래는 내 코드
<!DOCTYPE html>
<html lang=ko>
<head>
<meta charset=utf-8>
<meta http-equiv=X-UA-Compatible content="IE=edge">
<link rel=icon href=/favicon.ico>
<title>안녕하세요</title>
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@400;500;700&display=swap" rel=stylesheet>
<link rel=stylesheet href=https://cdn.jsdelivr.net/npm/@mdi/font@latest/css/materialdesignicons.min.css>
<link href=/css/app.fe458c0a.css rel=preload as=style>
<link href=/css/chunk-vendors.1d46c801.css rel=preload as=style>
<link href=/js/app.c0c7d1ad.js rel=preload as=script>
<link href=/js/chunk-vendors.c205890e.js rel=preload as=script>
<link href=/css/chunk-vendors.1d46c801.css rel=stylesheet>
<link href=/css/app.fe458c0a.css rel=stylesheet>
</head>
<body>
<noscript><strong>We're sorry but Hello World doesn't work properly without JavaScript enabled. Please enable it
to continue.</strong></noscript>
<div id=app></div>
<script src=/js/chunk-vendors.c205890e.js></script>
<script src=/js/app.c0c7d1ad.js></script>
</body>
</html>
여기서 href 나 src 뒤에 "/**" 들을 "**" 로 맨 앞의 "/" 를 지워주면 진입 화면은 동작한다.
그런데 나머지 화면들은 여전히 동작하지 않으니, 모든 경로 앞에 "/" 를 없애야 하나 싶었다
그래서 vue.config.js 파일에 "publicPath: ''" 이걸 추가했다
module.exports = {
publicPath: ''
}이랬더니 동작 성공
728x90
'Server' 카테고리의 다른 글
| Spring Boot 에 Swagger2 적용 방법 (0) | 2023.01.31 |
|---|---|
| SeleniumLibrary SSH 환경 Chrome 에서 파일 다운로드 (0) | 2022.07.02 |
| Ubuntu 22.0.4 + Robot + SeleniumLibrary 환경 만들기 (0) | 2022.06.30 |
| Jenkins 버전 업데이트 (0) | 2022.03.06 |
| Docker 이미지 <none> 태그만 골라서 몽땅 지우기 (0) | 2022.02.08 |
