yisj's blog

vue add eslint 하면 된다. rules에 off할 룰들을 off한다.

vue.js에서 prettier를 사용하면 다음과 같은 에러가 뜨는데, .eslintrc.js 파일에서 rules 부분을 다음과 같이 고쳐주면 해결된다.

axios.get() 메서드를 사용해서 공공데이터를 가져오는 과정에서 다음 오류에 맞딱뜨렸다. 나의 axios 코드는 다음과 같다. 에러의 원인은 여러가지가 있을 수 있는데(주소를 틀려서일수도 있다), 이번 원인은 아직 서비스키가 제대로 등록되지 않았기 때문인 것 같다. 서비스키를 발급받고 2~3시간 후에 사용가능하다고 하는데, 현재 공공데이터 서버는 다음의 XML을 응답하고 있다. 에러 코드는 99이고, 서비스키가 등록되지 않았단다. 2시간 이후에 시도해야 할 것 같다.

브라우저마다 에러가 다르게 뜬다. 크롬에서: Uncaught SyntaxError: Cannot use import statement outside a module 파이어폭스에서: SyntaxError: import declarations may only appear at top level of a module 이 에러는 script 태그에 type="module" 속성을 지정하면 해결된다. 왜 이런 에러가 발생하고 왜 type="module" 속성을 지정해야 할까? import문을 사용하기 때문이다. import문을 사용한다는 것은 곧 그 스크립트는 모듈울 사용한다는 것이다. script 태그에 type="module" 속성을 사용한다는 것은 곧 이 스크립트를 모듈로서 정의하겠다는 것과 같다. type..

vue-element-admin 리뷰 Layout components folder components/index.js {AppMain, Navbar, Settings, Sidebar, TagsView} 을 익스포트하게 된다. 이는 나중에 layout/index.vue에서 import { AppMain, Navbar, Settings, Sidebar, TagsView } from './components' 에서 임포트 되어 사용된다. layout/index.vue Vue.js 문법 :class="classObj" : Object Syntax, true 이면 포함, false 이면 제외 :class는 v-bind:class의 축약형 import RightPanel from '@/components/Right..

Admin 페이지 만들기 Vue Admin 템플릿 리서치 cool-admin 이라든지 rest-admin 이라든지 깃헙에서 vue.js admin 을 검색해보면 여러 프로젝트가 검색된다. 이 중에서 별이 가장 많은 것을 이용하는 것이 가장 안전할 것이다. 내가 조사한 템플릿은 다음과 같다. https://github.com/PanJiaChen/vue-admin-template https://github.com/Armour/vue-typescript-admin-template https://github.com/wxs77577/rest-admin 이 중에서, PanJiaChen의 vue-admin-template(vue-element-admin)을 이용하여 데모 페이지를 만들기로 하자. 아무래도 처음부터 다..

Element-Plus el-menu 스타일링이 안되는 문제 혹시 몰라서 도큐먼트의 예시 코드를 그대로 복사 붙여넣기 했는데도 안됐다. 그런데 버튼은 또 된다 뭐가 문제일까?

#34495E #41B883

간단한 영상 스트리밍 앱 만들기 vue-cli로 앱 만들기 $ vue create hello // Vue Version 3를 선택한다 $ vue add router $ vue add element-plus // Import on Demand와 en을 선택한다element-plus 스타일이 적용되지 않는 에러 해결하기 172... 로 시작하는 IP 주소는 AWS EC2의 프라이빗 IP 주소이다. 이것을 퍼블릭 IP 주소, 탄력적 IP 주소로 바꿔줘야 한다. 그러나 더 좋은 것은... 서버에서 실행할 것이 아니라, production으로 빌드된 Vue.js 앱을 그냥 static으로 전송하는 것이다. 그렇지 않을까? 그렇다면 이 에러는 굳이 해결할 필요가 없는 에러이다. router 설정하기 이 앱에는 다음..

Invalid Host header 로컬에서 개발할 때는 잘 됐다. 버츄얼박스 게스트에서 개발해서 호스트에서 접속하는 등 테스트를 할 때도 잘 됐다. 그런데 EC2 에서 vue-cli를 이용해 Vue.js 앱을 만들고 접속을 하려고 했더니 Invalid Host header 에러가 뜬다. 잠시 구글링을 해보니 이 에러는 webpack과 연관이 있는 듯하다. vue webpack invalid host header로 검색을 했더니 다음의 해결책을 발견했다. Vue.js 앱의 루트 폴더(babel.config.js가 있는 위치)에 vue.config.js를 만들고 위의 내용을 넣어서 저장한다. 그리고 Vue의 devServer를 재시작했더니 npm run serve 다음과 같이 에러가 사라졌다!