VSCode는 틀림없이 없어서는 안 될 도구이지만, 언어나 작업공간에 따라 확장을 활성화/비활성화할 수 있는 중요한 설정이 없습니다.
거의 저예요. 하루 종일 서로 다른 언어의 프로젝트 사이를 뛰어다녔어요. 저는 확장과 설정이 많아서 자원을 소모하는 장면마다 쓸모가 없어요.모든 항목에서 수동으로 비활성화할 수 있지만, 새 항목을 만들려면 다시 만들어야 합니다.그것은 시간을 낭비하는 것이다.
VSCode 팀이 이 문제를 해결했지만 우리는 노드 개발에 사용할 전용 개요 파일을 만드는 방법을 사용할 수 있습니다.
이것은 완벽하지 않다. 왜냐하면 당신은 여러 장면에서 사용하는 확장을 공유할 수 있기 때문이다.하지만 빠른 설정을 지원하기 위해 디스크에 공간을 적게 두는 것을 더 좋아합니다.

구성 파일 만들기

우리는 --extensions-dir 및 --user-data-dir 파라미터를 사용하여 확장과 데이터에 대한 새로운 프로필 폴더를 만들 것입니다.
운영 체제
명령
비옷code --extensions-dir "$HOME/.vscode/profiles/node/extensions" --user-data-dir "$HOME/.vscode/profiles/node/data"linuxcode --extensions-dir "$HOME/.vscode/profiles/node/extensions" --user-data-dir "$HOME/.vscode/profiles/node/data"이기다code --extensions-dir "%HOMEPATH%/.vscode/profiles/node/extensions" --user-data-dir "%HOMEPATH%/.vscode/profiles/node/data"

⚠️ WSL2 does not support --extensions-dir or --user-data-dir flags

어떻게 사용합니까?

너 미쳤어?Node?를 사용할 때마다 이 긴 명령을 작성하고 기억해야 합니다.
아니오, 물론 아니에요.

macOS/Linux에서

이 이미지는 이 경로$HOME/.vscode/profiles/node/download에 있습니다.

도크 발사기

같은 경로에서 code-node.command 라는 파일을 만들고 다음 코드를 포함합니다.

open -n -a "Visual Studio Code.app" --args --extensions-dir="$HOME/.vscode/profiles/node/extensions" --user-data-dir="$HOME/.vscode/profiles/node/data"

사용 권한 저장 및 사용chmod +x code-node.command.
클립보드의 icon-node.png 내용을 복사합니다.미리보기에서 그림을 열고 Edit > Select All 를 선택한 다음 Edit > Copy 을 선택하거나 Command-C 를 누르는 방법이 있습니다.code-node.command 파일을 선택한 다음 File > Get Info 을 선택합니다.정보 창 상단에서 아이콘의 그림을 눌러서 선택한 다음 Edit > Paste 을 선택하거나 Command-V 을 누르십시오.code-node.command 파일을 선택한 다음 File > Make Alias 또는 Command-L 키를 눌러 VSCode 노드로 이름을 지정합니다.이 Alias 바로 가기를 Dock이나 데스크톱으로 드래그하면 됩니다.

Recommended configurations: Open a terminal window, go to 'Preference > Profiles. Set Auto close terminal on exit: inside 'Shell' tab, select "Close if the shell exited cleanly" on "When the shell exits" option.

별칭

이런 상황에서 별명은 아마도 우리의 가장 친한 친구일 것이다..zshrc 또는 .bash_profile 을 열고 붙여넣습니다.

alias code-node="code --extensions-dir \"$HOME/.vscode/profiles/node/extensions\" --user-data-dir \"$HOME/.vscode/profiles/node/data\""

파일을 저장하고 터미널 창을 다시 시작합니다.이제 code . 명령을 사용하여 VSCode에서 폴더 항목을 열 수 있지만 노드를 사용하려면 code-node . 로 변경합니다.

Windows에서

이 아이콘은 이 경로%HOMEPATH%/.vscode/profiles/node/extensionsdownload에 있습니다.

바로 가기

같은 경로에서 바로 가기 파일을 만들고 다음 속성을 설정합니다.
이름: VSCode Node대상 설정:

"C:\Users\%USERNAME%\AppData\Local\Programs\Microsoft VS Code\Code.exe" --extensions-dir "%HOMEPATH%/.vscode/profiles/node/extensions" --user-data-dir "%HOMEPATH%/.vscode/profiles/node/data"

시작:

"C:\Users\%USERNAME%\AppData\Local\Programs\Microsoft VS Code"

이전에 다운로드한 아이콘을 사용합니다.

Sadly on Windows create an alias it slightly more complicated than macOS/Linux, then you only can open it using the shortcut and can't open it directly from the project path. But if you are using WSL you can use the same alias approach from mac/linux.

색깔

VSCode와 노드 스타일의 VSCode 버전을 사용할 때 식별할 수 있는 것이 좋습니다.

{
    "workbench.colorCustomizations": {
        "activityBar.background": "#68A063",
        "activityBar.foreground": "#000000",
        "activityBar.inactiveForeground": "#00000099",
        "activityBarBadge.background": "#303030",
        "activityBarBadge.foreground": "#ffffff",
        "statusBar.noFolderBackground": "#3C873A",
        "statusBar.background": "#68A063",
        "statusBar.foreground": "#000000",
        "statusBarItem.hoverBackground": "#3C873A"
    }
}

설치.json

그게 다야.이제 어떤 설정과 확장을 설치할지 결정하십시오.이것들은 내가 가장 좋아하는 건의이다.

확장

편집하다

DotENV

Template String Converter

디버깅

Debug Visualizer

Turbo Console Log

{
    "turboConsoleLog.logMessagePrefix": "DEBUG -> "
}

설치.json

편집하다

lit-html

npm Intellisense

Path Intellisense

{
    "javascript.suggest.paths": false,
    "typescript.suggest.paths": false
}

설치.json

용기

Docker

쉬다

REST Client

Paste JSON as Code

vscode-random

코드 세그먼트

Arrow Function Snippets

JavaScript (ES6) code snippets

node-snippets

동기화

여러 GitHub 사용자 계정을 사용할 수 있고 프로필을 만들 수 없기 때문에 내장된 VSCode 동기화 옵션을 좋아하지 않습니다.
그러나 걱정하지 마세요. 우리는 모두가 알고 있는 Setting Sync 확장을 사용할 수 있습니다.
사용자 이름에 create another GitHub account을(를) 추가하고 -node을(를) Gmail 계정에 추가하십시오.

이 기술이 있으면 새로운 전자 메일 계정을 만들지 않고 다른 GitHub 계정을 가질 수 있습니다.새 +node 계정만 사용하면 노드 스타일 VSCode 버전을 여러 장치에서 동기화할 수 있습니다.
이게 다야!
즐거움 코드🖖