[VSCode] WSL Ubuntu에서 ASP.NET Core 개발환경 세팅

재미삼아 WSL Ubuntu 기반에 .NET 개발환경을 구축해보았다.

1. .NET 설치

WSL Ubuntu 에서 .NET을 설치한다. 설치는 .MS 공식문서에 잘 나와있다.

docs.microsoft.com/ko-kr/dotnet/core/install/linux-ubuntu#2004-

Ubuntu에 .NET 설치 - .NET

설치가 완료되면 dotnet --version 명령어로 확인할 수 있다.

2. ASP.NET 프로젝트 생성

명령어로 ASP.NET 프로젝트를 생성한다. 예시의 명령어는 react를 웹 클라이언트 프로젝트가 포함된 webAPI 생성 명령어이다. 프로젝트는 "ASPNETCoreReact" 라는 이름의 디렉토리로 하위 위치에 생성된다. react 프로젝트는 webAPI 디렉토리 하위에 "ClientApp" 디렉토리로 생성한다.

* 프로젝트 특성상 npm 명령어도 함께 사용되므로 WSL에 node가 설치되어 있어야 한다.

dotnet new react -o ASPNETCoreReact

3. code 명령어로 VSCode 실행

VSCode에 Remote - WSL 확장이 설치되어 있다면, WSL bash 안에 code 명령어를 입력하여 Host OS에 설치된 VSCode를 실행할 수 있다. 없다면 아래 이미지와 같이 생긴 확장을 설치하자.

설치 이후 아래 명령어로 vscode를 실행시킨다. 물론 꼭 이 방법만 가능하다는 건 아니다.

* 만약 명령어가 여전히 동작하지 않는다면 세션을 종료 후 재연결이 필요할 수 있다.

code ASPNETCoreReact

실행하면 ASPNETCoreReact를 대상으로 한 vscode 창이 열린다.

 

 

4. launch.json 파일 생성

지금 상태에선 F5 키를 눌러도 정상적인 디버깅 및 실행을 수행할 수 없다. Debug 메뉴에서 "create a launch file"을 선택한다.

선택하면 커맨드창에 Select Enviroment 가 표시되는데, .NET Core 프로젝트이므로 .NET Core를 선택한다.

그러면 launch.json 파일이 자동으로 생성된다. 별다른 수정없이 F5를 눌러보도록 하자

 

5. 실행 확인

초기 실행시 .NET 및 npm 필요 명령어 수행을 위해 시간이 좀 소요된다. 내부적인 작업이 종료되면 VSCode에서 다음과 같은 경고창이 표시된다.

open을 선택하면 브라우저가 열리면서 경고창이 표시된 사이트가 열린다.

고급을 누른 뒤 안전하지 않음 이동을 선택하면 사이트가 표시된다.