vscode를 열심히 사용하다보니 아래와 같은 오류 메시지를 접하게 되었다. 현재 2019.11.26일 시점에 vscode의 오류인것 같다. vscode는 valid 한 파일 이름으로 ([$\\w]+\\.)*[$\\w]+ 정규식을 통과해야 한다. 한글은 \w에 부적합 하기 때문에 사용할 수 없다. ㅜㅜ

앞선 포스트에서는 Vue 프로젝트에서 배포 후 Spring Boot 앱으로 수동으로 배포시켰다. vue-cli의 build 명령에는 dest 옵션이 있어서 필요한 경로에 파일을 배포할 수도 있다. "scripts": { "serve": "vue-cli-service serve --open --port 9090", "build": "vue-cli-service build --dest c:/ssafy/boot_backend/demo/src/main/webapp/WEB-INF/vue-dist", "lint": "vue-cli-service lint" },

드디어 스프링 부트와 Vue 앱을 연동해보자. 1. build 먼저 yarn build 명령을 이용해서 vue 앱의 배포 버전을 생성한다. dist 경로에 index.html 파일도 생성되는데 이 파일에서 다른 js, css 들을 링크해서 사용중이다. 주의할 점은 이 경로들이 절대경로라는 점이다. 모든 경로를 상대경로로 바꿔주자. 2. 스프링 부트에 파일 배포 src/main/webapp/WEB-INF/에 Vue의 dist를 이동시키고 vue-dist로 rename 해준다.(다른 dist가 있을 것을 대비해서) 또한 index.html 파일도 vue.html로 변경한다. 3. 스프링 부트에서 정적 리소스를 연결한다. @SpringBootApplication public class DemoApplicati..

간단히 page를 routing 시킨 후 spring boot에서 사용할 수 있게 해보자. 뷰 프로젝트의 구조는 아래와 같다. 1. package.json 설정 - 실행시 브라우저 자동 연동 처리 "scripts": { "serve": "vue-cli-service serve --open --port 9090", "build": "vue-cli-service build", "lint": "vue-cli-service lint" }, - console 사용 허용 "rules": { "no-console":"off" }, 2. axios.js - axios 통신 설정 import axios from "axios" export default axios.create({ baseURL:"http://localho..

vscode에서 spring boot 앱을 생성하고 Vue를 클라이언트로 구성해보자. 1. 먼저 vscode를 통해서 spring boot를 작업하기 위해 필요한 플러그인들을 설치한다. 자바 확장팩 스프링 부트 관련 확장팩 2. 새로운 스프링 부트 프로젝트 생성 F1 입력 후 Spring Initializr: Generate a Maven Project를 선택한다. 사용 언어는 Java를 선택한다. group id는 com.example을 입력한다. artipact id는 demo 를 입력한다. 부트 버전을 선택한다.(2.2.1) starter에서 필요한 의존성을 선택한 후 enter를 입력한다. 탐색기를 통해 프로젝트를 저장할 폴더를 선택후 새 창에서 vscode를 실행한다. 다시 vscode가 실행되..

1. Git 서버에 프로젝트를 생성한다. * vs code에서 프로젝트를 clone 한다. 2. F1 > git:clone 3. 다음 창에서 1에서 생성한 Repository URL을 입력한다. 4. 프로젝트의 경로 선택 5. clone이 완료되면 새 창에서 열기를 선택한다. 6. 터미널을 현재 프로젝트의 상위 폴더에서 연다. 7. vue create 프로젝트명 을 입력한다. 이때 프로젝트 이름은 폴더 명과 같은 이름으로 작성 8. git 설정을 어떻게 할지 결정한다. - Merge 선택 --> 프로젝트 생성 완료 9. git ignore를 확인하고 node_module가 제외되는지 확인한다. .DS_Store node_modules /dist # local env files .env.local .env..

vue 프로젝트 생성 시 eslint를 포함시키면 package.json 파일에 eslint에 대한 설정이 포함된다. "eslintConfig": { "root": true, "env": { "node": true }, "extends": [ "plugin:vue/essential", "eslint:recommended" ], "rules": { "no-console": "off" }, "parserOptions": { "parser": "babel-eslint" } }, 이때 rules 부분에 global하게 추가하고 싶은 규칙들을 적어주면 yarn lint 명령을 통해서 작성한 javascript가 권장 규칙에 맞는지 확인할 수 있다. 예를 들어 위의 no-console:off 부분은 no-conso..

1. [이 시스템에서 스크립트를 실행할 수 없으므로 파일을 로드할 수 없습니다.] 오류 처리 관리자 권한으로 powershell 수행 후 PS D:\workspaces\vscode\vue\andy\ch11_vuex> Set-ExecutionPolicy RemoteSigned 2. 하위 디렉토리까지 삭제하기 구문 Remove-Item [-Path] [-Confirm] [-Credential ] [-Exclude ] [-Filter ] [-Force] [-Include ] [-Recurse] [-Stream ] [-UseTransaction] [-WhatIf] [] 축약형: rm -r -fo