[Vue.js Spring-Boot] VS Code로 개발환경 설정하기 (미완)

1. [Vue.js Spring-Boot] VS Code로 개발환경 설정하기   (본문)

 

 

회사에서 front 작업을 요청받아서 Vue.js를 사용하게 되었는데

VS Code로 개발환경을 세팅해야 하는 상황이라 공부한 기록을 정리하여 기록한다.

 

필요한 소프트웨어와 확장 프로그램을 설치

 

1. VS Code 설치

먼저 VS Code 소프트웨어를 먼저 설치해줍니다.

Visual Studio Code: https://code.visualstudio.com/

Visual Studio Code - Code Editing. Redefined

 

개발환경 세팅에 필요한 Extensions를 추가해줍니다. (View > Extensions)

1) Extension Pack for Java

# settings.json 자바설정 추가(파일> 기본 설정> 설정)

    "java.configuration.runtimes": [
        {
        "name":"JavaSE-11",
        "path":"C:\\Program Files\\Java\\jdk-11.0.14",
        "default": true
        }
    ]

 

2) Spring Boot Extension Pack

 

3) Vetur

 

4) Auto Close Tag ( 선택 )

 

2. Node.js 설치 (2022.03.01 기준 LTS 16.14.0 LTS 버전)

nodejs: https://nodejs.org/ko/

Node.js

 

3. Maven 설치 ( 3.8.4 )

https://maven.apache.org/download.cgi

Maven – Download Apache Maven

파일 다운로드하여 {maven_home}\bin을 환경변수로 등록

---

 

Vue CLI / Spring Boot 연동

 

1. Spring Boot 프로젝트 설치

스프링 프로젝트 생성: https://start.spring.io/

아래와 같이 spring initializr 설정을 해주고 다운로드하면 zip 파일 형태로 받게 된다.

원하는 곳에 옮겨주고  vscode에 상위 폴더를 가져다 넣어준다.

 

2. Npm 모듈 설치

npm i -g @vue/cli
npm i -g @vue/cli-init

vue init webpack frontend

아래 설정으로 vue를 설치하였다. (spring boot 설치 폴더 안에서)

완료되면 프로젝트 구성은 이렇게 된다.

frontend/condif/index.js 에서 build ouput path를 설정해준다.

 

설정이 완료되면 frontend 폴더에서 npm run build를 해준다.

그렇게 하면 아래 폴더에 static 폴더가 빌드된 것을 확인할 수 있다.

 

이제 spring-boot 서버를 실행해보자 

(여기서 아직 막힘)

아래 명령어로 실행하였지만 서버 동작하지 않음

client log로 보았을 때 자바 경로 문제인 건지.. 자세히 모르겠다 ㅠㅠ (추후 내가 해줄 것이다..........)

{
  message: "Use the JDK from '' as the initial default project JDK.",
  level: 'info',
  timestamp: '2022-03-11 23:29:00.853'
}
{
  message: 'Starting Java server with: c:\\Users\\user\\.vscode\\extensions\\redhat.java-1.3.0\\jre\\17.0.1-win32-x86_64\\bin\\java --add-modules=ALL-SYSTEM --add-opens java.base/java.util=ALL-UNNAMED --add-opens java.base/java.lang=ALL-UNNAMED --add-opens java.base/sun.nio.fs=ALL-UNNAMED -Declipse.application=org.eclipse.jdt.ls.core.id1 -Dosgi.bundles.defaultStartLevel=4 -Declipse.product=org.eclipse.jdt.ls.core.product -Djava.import.generatesMetadataFilesAtProjectRoot=false -Dfile.encoding=utf8 -DwatchParentProcess=false -XX:+UseParallelGC -XX:GCTimeRatio=4 -XX:AdaptiveSizePolicyWeight=90 -Dsun.zip.disableMemoryMapping=true -Xmx1G -Xms100m -jar c:\\Users\\user\\.vscode\\extensions\\redhat.java-1.3.0\\server\\plugins\\org.eclipse.equinox.launcher_1.6.400.v20210924-0641.jar -configuration c:\\Users\\user\\AppData\\Roaming\\Code\\User\\globalStorage\\redhat.java\\1.3.0\\config_ss_win -data c:\\Users\\user\\AppData\\Roaming\\Code\\User\\workspaceStorage\\d2ad9bc39e414ff5b9e3771ae588f79e\\redhat.java\\ss_ws',
  level: 'info',2022-03-11 23:29
  timestamp: ':02.670'
}
{
  message: 'Starting Java server with: c:\\Users\\user\\.vscode\\extensions\\redhat.java-1.3.0\\jre\\17.0.1-win32-x86_64\\bin\\java --add-modules=ALL-SYSTEM --add-opens java.base/java.util=ALL-UNNAMED --add-opens java.base/java.lang=ALL-UNNAMED --add-opens java.base/sun.nio.fs=ALL-UNNAMED -Declipse.application=org.eclipse.jdt.ls.core.id1 -Dosgi.bundles.defaultStartLevel=4 -Declipse.product=org.eclipse.jdt.ls.core.product -Djava.import.generatesMetadataFilesAtProjectRoot=false -Dfile.encoding=utf8 -DwatchParentProcess=false -XX:+UseParallelGC -XX:GCTimeRatio=4 -XX:AdaptiveSizePolicyWeight=90 -Dsun.zip.disableMemoryMapping=true -Xmx1G -Xms100m -XX:+HeapDumpOnOutOfMemoryError -XX:HeapDumpPath=c:\\Users\\user\\AppData\\Roaming\\Code\\User\\workspaceStorage\\d2ad9bc39e414ff5b9e3771ae588f79e\\redhat.java -jar c:\\Users\\user\\.vscode\\extensions\\redhat.java-1.3.0\\server\\plugins\\org.eclipse.equinox.launcher_1.6.400.v20210924-0641.jar -configuration c:\\Users\\user\\AppData\\Roaming\\Code\\User\\globalStorage\\redhat.java\\1.3.0\\config_win -data c:\\Users\\user\\AppData\\Roaming\\Code\\User\\workspaceStorage\\d2ad9bc39e414ff5b9e3771ae588f79e\\redhat.java\\jdt_ws',
  level: 'info',
  timestamp: '2022-03-11 23:29:03.263'
}
{
  message: '[Error - 오후 11:29:09] Connection to server got closed. Server will not be restarted.',
  level: 'info',
  timestamp: '2022-03-11 23:29:09.900'
}
{
  message: 'The Language Support for Java server crashed and will restart.',
  level: 'error',
  timestamp: '2022-03-11 23:29:23.493'
}
{
  message: '[Info  - 오후 11:29:23] Connection to server got closed. Server will restart.',
  level: 'info',
  timestamp: '2022-03-11 23:29:23.493'
}
{
  message: 'The Language Support for Java server crashed and will restart.',
  level: 'error',
  timestamp: '2022-03-11 23:29:26.930'
}
{
  message: '[Info  - 오후 11:29:26] Connection to server got closed. Server will restart.',
  level: 'info',
  timestamp: '2022-03-11 23:29:26.930'
}
{
  message: 'The Language Support for Java server crashed and will restart.',
  level: 'error',
  timestamp: '2022-03-11 23:29:27.658'
}
{
  message: '[Info  - 오후 11:29:27] Connection to server got closed. Server will restart.',
  level: 'info',
  timestamp: '2022-03-11 23:29:27.658'
}
{
  message: 'The Language Support for Java server crashed and will restart.',
  level: 'error',
  timestamp: '2022-03-11 23:29:27.683'
}
{
  message: '[Info  - 오후 11:29:27] Connection to server got closed. Server will restart.',
  level: 'info',
  timestamp: '2022-03-11 23:29:27.683'
}
{
  message: 'The Language Support for Java server crashed 5 times in the last 3 minutes. The server will not be restarted.',
  level: 'error',
  timestamp: '2022-03-11 23:29:27.714'
}
{
  message: '[Error - 오후 11:29:27] Connection to server got closed. Server will not be restarted.',
  level: 'info',
  timestamp: '2022-03-11 23:29:27.715'
}
{
  message: "Use the JDK from '' as the initial default project JDK.",
  level: 'info',
  timestamp: '2022-03-11 23:45:03.831'
}
{
  message: 'Starting Java server with: c:\\Users\\user\\.vscode\\extensions\\redhat.java-1.4.0\\jre\\17.0.2-win32-x86_64\\bin\\java --add-modules=ALL-SYSTEM --add-opens java.base/java.util=ALL-UNNAMED --add-opens java.base/java.lang=ALL-UNNAMED --add-opens java.base/sun.nio.fs=ALL-UNNAMED -Declipse.application=org.eclipse.jdt.ls.core.id1 -Dosgi.bundles.defaultStartLevel=4 -Declipse.product=org.eclipse.jdt.ls.core.product -Djava.import.generatesMetadataFilesAtProjectRoot=false -Dfile.encoding=utf8 -DwatchParentProcess=false -javaagent:C:/Users/user/.vscode/lombok.jar -jar c:\\Users\\user\\.vscode\\extensions\\redhat.java-1.4.0\\server\\plugins\\org.eclipse.equinox.launcher_1.6.400.v20210924-0641.jar -configuration c:\\Users\\user\\AppData\\Roaming\\Code\\User\\globalStorage\\redhat.java\\1.4.0\\config_ss_win -data c:\\Users\\user\\AppData\\Roaming\\Code\\User\\workspaceStorage\\d2ad9bc39e414ff5b9e3771ae588f79e\\redhat.java\\ss_ws',
  level: 'info',
  timestamp: '2022-03-11 23:45:04.019'
}
{
  message: 'Starting Java server with: c:\\Users\\user\\.vscode\\extensions\\redhat.java-1.4.0\\jre\\17.0.2-win32-x86_64\\bin\\java --add-modules=ALL-SYSTEM --add-opens java.base/java.util=ALL-UNNAMED --add-opens java.base/java.lang=ALL-UNNAMED --add-opens java.base/sun.nio.fs=ALL-UNNAMED -Declipse.application=org.eclipse.jdt.ls.core.id1 -Dosgi.bundles.defaultStartLevel=4 -Declipse.product=org.eclipse.jdt.ls.core.product -Djava.import.generatesMetadataFilesAtProjectRoot=false -Dfile.encoding=utf8 -DwatchParentProcess=false -javaagent:C:/Users/user/.vscode/lombok.jar -XX:+HeapDumpOnOutOfMemoryError -XX:HeapDumpPath=c:\\Users\\user\\AppData\\Roaming\\Code\\User\\workspaceStorage\\d2ad9bc39e414ff5b9e3771ae588f79e\\redhat.java -jar c:\\Users\\user\\.vscode\\extensions\\redhat.java-1.4.0\\server\\plugins\\org.eclipse.equinox.launcher_1.6.400.v20210924-0641.jar -configuration c:\\Users\\user\\AppData\\Roaming\\Code\\User\\globalStorage\\redhat.java\\1.4.0\\config_win -data c:\\Users\\user\\AppData\\Roaming\\Code\\User\\workspaceStorage\\d2ad9bc39e414ff5b9e3771ae588f79e\\redhat.java\\jdt_ws',
  level: 'info',
  timestamp: '2022-03-11 23:45:04.128'
}
{
  message: '[Error - 오후 11:45:09] Connection to server got closed. Server will not be restarted.',
  level: 'info',
  timestamp: '2022-03-11 23:45:09.876'
}

> mvn install

> mvn spring-boot:run

(2022-03-19) 현재 pom.xml 파일 수정하여 재빌드 테스트