2월, 2019의 게시물 표시

jQuery + 네이버맵을 Vue 변환 방법

jQuery 를 기반으로 네이버맵을 활용한 서비스가 하나 있다. 지도 위에 각 오브젝트 좌표를 표시하여 모니터링을 보여준다. Vue/Cli 를 설치하여 변환하고자 한다. 먼저 기본 프로젝트를 생성하자 $ vue create my-project 기본 프로젝트 내용을 만들어 준다. 네이버맵을 사용하기 위해서 /public 폴더에서 index.html 파일에 추가한다. < script type = 'text/javascript' src = 'https://openapi.map.naver.com/openapi/v3/maps.js?clientId=testId&callback=initMap' > < / script > 바로 아래에 jQuery 를 추가해준다. < script src = 'https://code.jquery.com/jquery-1.12.4.js' > < / script > 이제 App.vue 파일을 아래와 같이 수정해준다. < template > < div > < NaverMap ></ NaverMap > </ div > </ template > < script > import NaverMap from './components/NaverMap.vue' export default { name: 'App' , components: { NaverMap } } </ script > 이제 /Component 폴더에 NaverMap.vue 파일을 생성한다. < template > < div id = 'wrap' class = 'section' > < div id = &

Mac Mojave node install error

모하비에서 노드를 설치하고 npm install -g @vue/cli 를 설치하고자 하면 나는 오류 조치 방법이다. 일단 노드를 공식페이지에서 다운받아 설치하였다. sudo chown -R $(whoami) $(npm config get prefix)/{lib/node_modules,bin,share} 권한문제가 생길수 있으니 위 명령어로 권한을 변경 해준다. 이제 노드 모듈이 설치된 위치로 이동 하자 cd /usr/local/lib/node_modules/ 여기에 모듈이 들어가야 하는데 확인해보니 이 아래 /npm/node_modules 에 모듈이 있다. cd npm cd node_modules/ mv * ../../ 이 명령어를 실행해주면 상위 노드 모듈로 현재의 모듈을 이동 해준다. npm install -g @vue/cli npm update 이렇게 설치하니까 오류가 나지 않는다.