먼저 소스를 보자 # SPA인 이유 Vue.js는 해보니 SPA인것을 깨달았다. Vue 파일은 많이 생긴다. 아래 처럼 , 이것은 다 Vue파일이다.(MainMap.vue, SideBar.vue) 그래서 이 template 안에 MainMap, SideBar 가 각각 랜더링 하여 부분 부분으로 하나의 파일로 만들어진다. 그래서 SPA인것을 깨달았다. # @/ 뜻 @/하면 루트 디렉토리 범위에서 해당 파일을 찾는것이다. 그래서 해당 경로에 있는 MainMap.vue를 가져올 수 있다. # div id div id가 있다 아래쪽에 보면 #app를 style로 받아서 사용하는 것을 알 수 있다. # export default export default { } 이것의 의미는 구문으로 정의된 객체는 해당 컴포넌트..

# error: TypeError: (0 , i.openBlock) is not a function 에러가 뜨면서 vue-resizable 적용 안될시 에러 # 원인 : vue2와 vue-resizable 버전이 서로 호환되지 않으면 나타나는 에러 # 해결 : cmd에서 npm info vue-resizable versions 확인 후 원하는 버전을 다시 재설치 그전에 vue-resizable은 지워주자 @버전 입력하면 됨. npm install vue-resizable@2.0.5

# npm i ol 를 진행 npm ERR! code 1 npm ERR! path D:\2024\프론트엔드 프레임워크\project\frontend\node_modules\node-sass npm ERR! command failed npm ERR! command C:\Windows\system32\cmd.exe /d /s /c node scripts/build.js # 위와 같이 에러가 나온다. npm update --force 를 cmd 창에서 해본다. 해주면 아래와 같이 노드 버전에 맞는게 필요하다라는 문구로 바뀐다. # D:\2024\프론트엔드 프레임워크\project\frontend>npm install --save-dev node-sass sass-loader@^10 npm WARN EBADEN..

import OlLayerTile from 'ol/layer/Tile.js'; import OlView from 'ol/View.js'; import OlMap from 'ol/Map.js'; import OSM from 'ol/source/OSM'; import {fromLonLat} from 'ol/proj.js' 위에 처럼 해당 경로를 못 찾을때가 있다. not found 뭐라고 하면서. 그럴때는 해당 프로젝트 안에 node_modules안의 패키지가 없는 경우이다. 패키지를 다운 받아주면 예를 들어 npm i ol을 하면 경로를 다시 찾을 수 있다.