임이지의 블로그

상기 에러는 tfjs 가 설치되지 않았을때 발생한다. 아래명령어로 tfjs 를 설치한다 npm i @tensorflow/tfjs npm i @tensorflow/tfjs-vis

Web/개발 환경 2021. 6. 25. 14:06

v-for 지시자에 대한 vue컴파일러 경고 메세지 WARNING in ./node_modules/vue-loader/lib/template-compiler?{"id":"data-v-76af726f","hasScoped":false,"buble":{"transforms":{}}}!./node_modules/vue-loader/lib/selector.js?type=template&index=0!./src/components/CardPage.vue (Emitted value instead of an instance of Error) : component lists rendered with v-for should have explicit keys. See https://vuejs.org/guide/list.h..

Web/개발 환경 2021. 6. 23. 17:11

node.js, webpack, vue, vuetify 가 설치되어있는 환경을 가정합니다. 만약 미설치되어 있다면 node.js를 먼저 설치하시기 바랍니다. webpack-simple 프로젝트 생성 vue init webpack-simple painter-vuetify vue init webpack-simple [프로젝트명] 설치 완료된 화면입니다. dir 과 tree 명령으로 프로젝트 구성을 확인하도록 하겠습니다. dir 명령 결과 tree 명령 결과 npm install npm install 명령을 사용하여 package.json에 설정된 종속 라이브러리를 설치합니다. npm run dev localhost 를 실행합니다. 여기까지는 vue 가 설치 되어있는 상태입니다. Vuetify 설치 local..

Web/개발 환경 2021. 6. 18. 11:05

node.js 가 설치되어있다고 가정합니다. 만약 설치되어 있지 않다면 https://nodejs.org/ko/ 에서 설치하기시 바랍니다. VUE CLI 설치 -g 옵션으로 글로벌로 설치한다. npm install -g @vue/cli 프로젝트 생성 painter-vuetify라는 이름으로 생성한다. vue create painter-vuetify Vue2.x 버전대를 사용하고 있어 Default [Vue 2]를 선택했다. 설치가 완료되면 아래와 같은 화면이 나타난다. dir 명령으로 디렉터리를 확인하면 아래와 같다. tree 명령으로 확인하면 다음과 같다. Localhost 실행 아래 명령으로 실행한다. Vue 만 설치되어 있는 상태이다. npm run serve Vuetify 설치 npm 명령으로 v..

Web/개발 환경 2021. 6. 18. 10:19

Painter.vue를 작성하는 도중 위와 같은 오류가 발생했다. 원인을 알고서는 나중에 허탈했다. Drawing with mousemove event Canvas not supported 캔버스 되돌리기 캔버스 초기화 캔버스 저장하기 methods: 에서 stopDrawing(e) 함수가 문제였다. 아주아주 단순한 this. 키워드를 명시하지 않아서 발생한 문제였다. stopDrawing(e) { if (this.isDrawing) { this.drawLine(this.x, this.y, e.offsetX, e.offsetY); this.x = 0; this.y = 0; this.isDrawing = false; console.log(this.isDrawing); } 사소한 문제였는데 원인 찾느라고 고..

Web/개발 환경 2021. 6. 17. 12:47

오류 내용 npm run dev 명령을 실행 시 아래와 같은 오류가 나타났다. 해결안 npm 이 설치되어 있지 않아서 생긴 문제이다. 커맨드 창에서 npm install 명령을 입력한다. npm이 install이 완료되면 아래 명령어를 입력한다. npm run dev

Web/개발 환경 2021. 6. 11. 16:34

Vue.js 를 사용하기 위한 기본 환경설정을 구성합니다. Atom Editor 및 Seti Theme 와 language-vue 환경설정을 합니다. https://atom.io/ A hackable text editor for the 21st Century At GitHub, we’re building the text editor we’ve always wanted: hackable to the core, but approachable on the first day without ever touching a config file. We can’t wait to see what you build with it. atom.io atom.io 에 접속하여 각 플랫폼에 맞는 환경으로 다운로드합니다. 스플래시 ..

Web/개발 환경 2021. 6. 11. 11:23