카카오 지도를 붙이려고 하는데 "kakao is not defined at eval" 이라는 에러 문구가 떴다.
카카오 지도와 연결을 하지 못해서 생기는 에러인데
1. kakao developer 앱키를 제대로 입력하지 않았을 경우,
2. kakao developer 사이트 도메인에 등록하지 않았을 경우,
에 다음과 같은 오류가 발생할 수 있다.
하지만 난 저 두가지 외 에서 발생하는 오류였다...ㅠㅠ
webpack plugins - template 에 등록되어있는 home.hbs에 script 부분을 수정을 해봐도 개발자도구에서
header 부분이 변경되지 않았다..!!!!
hbs를 html로 변환해야 동작하는데 변환해주지 못해서 생기는 오류였다. (변환해주지 않으면 html코드가 그대로 나옴)
html로 변환해주는걸 spring에서 변환을 해주는데, home.hbs만 수정을 하면 웹팩이 알아서 index.hbs에 반영을 해준다.
webpack.config.js
home.hbs
<html lang="ko">
<head>
<meta charset="utf-8" />
<meta
name="viewport"
content="width=device-width, initial-scale=1, shrink-to-fit=no"
/>
<meta name="subject" content="제목" />
<meta name="title" content="Consulting & Development INNOVATOR 제목" />
<meta name="keywords" content="키워드" />
<meta
name="description"
content="내용을 입력해주세요"
/>
<meta name="language" content="Korean" />
<meta name="author" content="내용" />
<meta name="publisher" content="내용" />
<meta
name="copyright"
content="Copyright Rimco Inc. All rights reserved."
/>
<meta name="distribution" content="global" />
<meta name="robots" content="index,follow" />
<meta property="og:title" content="제목" />
<meta
property="og:description"
content="내용"
/>
<meta
property="og:image"
content="https://shopping-homepage.amazonaws.com/logo.png"
/>
<meta property="og:url" content="http://naver.com" />
<meta property="product:brand" content="제목" />
<title>주식회사 쇼핑몰</title>
<script
type="text/javascript"
src="//dapi.kakao.com/v2/maps/sdk.js?appkey=키값"
></script>
</head>
<body>
<div id="root"></div>
</body>
</html>
index.hbs
heme.hbs에 입력을하면
home.hbs 동일하지만 header 부분에 아래와 같은 코드가 자동으로 삽입된다.
<link rel="icon" href="/dist/favicon.png" />
<script defer="defer"src="/dist/vendors.js?v=000000000000000"
>
</script>
<script defer="defer" src="/dist/index.js?v=00000000000000"
></script>
<link href="/dist/index.css?v=000000000000000" rel="stylesheet"
/>
결국은 html로 변환해주지 않아서인데
배포를 해주면 모든것이 해결되는 문제였다...!!!
배포한다음 header부분을 보니 kakao map script 부분에 삽입이 되어있었다.
반응형
'오류&해결' 카테고리의 다른 글
| Firebase cors 에러 (0) | 2022.09.07 |
|---|---|
| sh: vite: command not found 프로젝트 실행되지 않았을 때 npm install 명령어 (0) | 2022.06.17 |
| $(function(){ }); 실행 안될 때 Uncaught ReferenceError: $ is not defined 해결 (0) | 2022.02.23 |
| [Git] Sourcetree push 소스트리 푸시 오류 해결 (0) | 2022.02.03 |
| [Mysql] Unexpected error (103) returned by AddToSystemClassLoaderSearch 오류 (0) | 2022.02.01 |
