vscode CLI 도구라고 하면 일상 업무에는 필요하지 않기 때문에 생소하실 수도 있습니다. 그러나 그 기능 중 일부는 매우 실용적이고 최근 기술 아이디어 중 일부는 이를 통해 실현될 수 있으므로 이 기사에서는 VSCode CLI의 실제 기능에 대해 설명합니다. [추천 학습: "vscode 입문 튜토리얼"]
VSCode CLI의 쉘 명령은 code라고 하며 code는 나중에 VSCode CLI를 참조하는 데 사용됩니다. 도구. code，后面都会用code来指代VSCode CLI工具。
code后面不带任何选项或参数执行，会打开VSCode最近一个会话。比如，如果你最近打开了projectA，无论现在projectA是否被其他窗口覆盖或者你已经退出VSCode，下面的命令都能快速打开projectA：
$ code
如果你正在使用shell，这个命令应该能帮助你迅速打开VSCode或者定位到刚才编辑的文件。
在这里我想问大家平时都是怎样用VSCode打开某个项目的，都是按以下步骤执行吗？
点击VSCode图标
点击菜单栏File
点击Open
在Mac的Finder里找到并打开
我就不是，我习惯了使用shell，觉得命令行操作比在Finder里查找要快。
code .命令是我平时用得最多的，它可以快速地在VSCode打开当前目录的项目。
我的所有项目都是放在一个固定的目录下，所以我只要先cd到项目目录下，再执行code .就好了。
当然，你也可以使用code <folder>的方式打开项目，效果是一样的。
code -g <file>:<line>:<character>命令可以快速跳转到文件某一行的某个字符。比如，下面这个命令会打开index.ts文件，光标定位到第18行，index为8的字符前面的位置。
$ code -g /project-path/src/index.ts:18:8
现在的一些dev工具比如react-dev-inspector和vue-devtools，它们能够让开发者点击DOM元素即可在VSCode打开并定位到对应的源码位置。原理都是在dev server运行的时候获取源码的位置信息并插入到DOM元素上，然后开发者点击DOM时给dev server发送位置信息，dev server再调用code的能力跳转源码。
如果你想快速对比两个文件，可以使用以下命令：
$ code -d file-path-a file-path-b
这对习惯使用VSCode对比文件差异以及解决冲突的同学来说应该比较有用。
这是我近期发现的最让我喜欢的功能了，包括以下几个点：
code --list-extensions --show-versions：以<publisher>.<extensionName>@<version>的形式罗列所有已安装的插件；code --install-extension <ext>：安装插件，可以加上--force选项防止弹窗提示；code --uninstall-extension <ext>：卸载插件。想象一下，如果让你来开发一个前端工程的脚手架，你会做哪些事情？
仿照市面上大部分的脚手架，当然会给用户提供editorConfig、eslint、prettier等代码格式相关的配置。但完成这些，脚手架只有90分。实际上，要想eslint等生效，用户还得安装相应的VSCode插件和配置settings.json。
settings.json还好说，可以在.vscode目录下创建settings.json实现团队成员间配置的共享以及覆盖本地配置，省去团队成员手动配置的麻烦和避免开发配置不一致的问题。
至于VSCode插件，一般来说，我们会让用户自己去安装或者默认他已经安装了。但对于前端小白或者新入职的同事来说，这无疑是痛苦的，也是优秀的脚手架开发者不能容忍的。这时，上面几个命令就发挥作用了。
--list-extensions查看用户是否安装了某个插件，如果没有，则使用--install-extension
code는 옵션이나 매개변수 없이 실행되며, VSCode의 최신 세션이 열립니다. 예를 들어, 최근에 projectA를 열었다면 projectA가 다른 창에 가려졌는지 또는 VSCode를 종료했는지에 관계없이 다음 명령을 사용하면 projectA code>：🎜rrreee🎜쉘을 사용하는 경우 이 명령을 사용하면 VSCode를 빠르게 열거나 방금 편집한 파일을 찾는 데 도움이 됩니다. 🎜<h3 data-id="heading-2"><strong>특정 프로젝트 열기</strong></h3>🎜 여기서는 일반적으로 VSCode를 사용하여 프로젝트를 어떻게 여는지 묻고 싶습니다. 항상 Do를 누르세요. 다음 단계를 따르시나요? 🎜<ul style="list-style-type: disc;">
<li>🎜VSCode 아이콘을 클릭하세요🎜</li>
<li>🎜메뉴 표시줄 File🎜</li>
<li>🎜클릭 on Open🎜 li></li>
<li>🎜Mac의 Finder에서 찾아 열기🎜</li>
</ul>🎜저는 쉘 사용에 익숙하고 검색보다 명령줄 작업이 더 빠른 것 같아요. 파인더에서. 🎜🎜<code>code . 명령은 제가 평소에 가장 많이 사용하는 명령입니다. VSCode의 현재 디렉터리에 있는 프로젝트를 빠르게 열 수 있습니다. 🎜🎜내 프로젝트는 모두 고정된 디렉터리에 있으므로 먼저 프로젝트 디렉터리로 cd한 다음 code .를 실행하면 됩니다. 🎜🎜물론 code<folder>를 사용하여 프로젝트를 열 수도 있으며 효과는 동일합니다. 🎜code -g <file>:<line>:< 문자> ; 명령은 파일의 특정 줄에 있는 특정 문자로 빠르게 이동할 수 있습니다. 예를 들어, 다음 명령은 index.ts 파일을 열고 index가 8인 문자 바로 앞의 18행에 커서를 놓습니다. 🎜rrreee🎜react-dev-inspector와 같은 일부 최신 개발 도구 🎜 및 vue-devtools🎜를 사용하면 개발자가 DOM 요소를 클릭하여 VSCode에서 열 수 있고 해당 소스 코드 위치를 찾습니다. 개발서버가 실행 중일 때 소스코드의 위치정보를 얻어서 DOM 요소에 삽입한 뒤, 개발자가 DOM을 클릭하면 해당 위치정보가 개발서버로 전달되고, 그 다음에는 개발서버가 전달하는 방식이다. 코드로 이동하는 기능을 호출합니다. 🎜 코드 - -list-extensions --show-versions: 설치된 모든 플러그인을 <publisher>.<extensionName>@<version> 형식으로 나열합니다.code --install-extension <ext>: 플러그인을 설치하려면 --force 옵션을 추가하여 팝업 프롬프트를 방지할 수 있습니다. code --uninstall-extension <ext>: 플러그인을 제거합니다. settings.json을 구성해야 합니다. 🎜🎜settings.json 다행히 .vscode 디렉터리에 settings.json을 생성하여 팀 구성원 간에 구성을 공유하고 로컬 구성을 덮어쓸 수 있습니다. 팀 구성원의 수동 구성 문제를 해결하고 일관되지 않은 개발 구성 문제를 방지합니다. 🎜🎜VSCode 플러그인의 경우 일반적으로 사용자가 직접 설치할 수 있도록 하거나 기본적으로 이미 설치되어 있습니다. 하지만 프론트엔드 초보자나 새로운 동료들에게는 이는 의심할 여지 없이 고통스러운 일이고, 뛰어난 스캐폴딩 개발자들에게도 참을 수 없는 일입니다. 이때 위의 명령이 실행됩니다. 🎜🎜--list-extensions 사용자가 플러그인을 설치했는지 확인하세요. 그렇지 않은 경우 --install-extension을 사용하여 설치하세요. 🎜.vscode와 결합된 플러그인 작동을 위한 위 명령의 도움으로 스캐폴딩은 사용자가 아무런 의미 없이 개발 환경을 완전히 구성하는 데 도움을 줄 수 있으며 모든 사람이 팀에서 동일한 구성을 사용하는 경우 언젠가 새로운 동료가 와서 그의 eslint가 적용되지 않는다고 걱정하지 마십시오. .vscode，脚手架可以完全无感地帮用户配置好开发环境，并且能够保证团队里每个人的配置都是一样的，不用担心突然有一天某个新同事跑过来说他的eslint不生效。
注意：插件操作相关的命令权力有点大，要小心使用。
有的同学可能会说，要使code生效，不得手动将code命令安装到全局环境变量PATH上吗？
在Mac上是这样的，但我们也能通过/Applications/Visual Studio Code.app/Contents/Resources/app/bin/code这个路径直接调用code。
对于Windows、Linux系统，VSCode安装时code就会自动添加到PATH，可以直接调用code。
所以，脚手架可以做一定的封装，避免用户手动添加环境变量。
这篇文章只介绍了VSCode CLI的一些我认为比较实用的功能，其他的诸如切换语言、性能监控等功能并没有介绍，大家可以通过文末资料里的链接跳转官网去查看。
最近我在简单封装code
참고: 플러그인 작업과 관련된 명령은 다소 강력하므로 주의해서 사용하세요.
코드를 효과적으로 만들어야 한다고 말할 수도 있습니다. 전역 환경 변수 PATH에 code 명령을 수동으로 설치하면 안 되나요? Mac에서는 이와 같지만 /Applications/Visual Studio Code.app/Contents/Resources/app/bin/code 경로를 통해 code를 직접 호출할 수도 있습니다. >.
Windows 및 Linux 시스템의 경우 VSCode를 설치하면 code가 PATH에 자동으로 추가되며, code를 직접 호출할 수 있습니다.
code 관련 명령을 간단히 캡슐화했습니다. 프로젝트 주소는 🎜github.com/avennn/입니다. vsc-…🎜, 모두 환영합니다. 괜찮다고 생각하시면 별점 주셔도 좋습니다. 🎜🎜VSCode에 대한 자세한 내용을 보려면 🎜vscode 튜토리얼🎜을 방문하세요! 🎜🎜위 내용은 VSCode CLI 도구에 대한 간략한 분석은 매우 유용한 것으로 나타났습니다!의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
