본문 바로가기

Dev/IDE vscode10

VS Code에서 HTML 작업 효율을 높이는 유용한 단축키와 한번에 여러 태그 수정하기 VS Code에서 HTML 작업 효율을 높이는 유용한 단축키와 한번에 여러 태그 수정하기 Visual Studio Code(VS Code)는 개발자들 사이에서 가장 인기 있는 코드 편집기 중 하나입니다. 특히 웹 개발에서 HTML을 작성할 때, VS Code의 다양한 단축키와 기능들은 생산성을 크게 향상시킬 수 있습니다. 이 글에서는 VS Code에서 HTML 작업을 보다 효율적으로 할 수 있게 도와주는 유용한 단축키와 여러 태그를 한 번에 수정하는 방법에 대해 알아보겠습니다. HTML 작업에 유용한 VS Code 단축키 자동 완성(Emmet Abbreviation): Tab 키를 사용하여 HTML 태그를 빠르게 완성할 수 있습니다. 예를 들어, ul>li*3을 입력하고 Tab 키를 누르면 태그 안에 태.. 2023. 11. 23.
VS CODE 주석 단축키 안될 때 해결 방법(Ctrl + /) VS CODE 주석 단축키 안될 때 해결 방법(Ctrl + /) 개발자라면 누구나 한 번쯤은 코드 에디터의 단축키에 의존해 본 경험이 있을 것입니다. 특히, Visual Studio Code (이하 VS Code) 사용자들 사이에서는 주석 처리 단축키인 Ctrl + /가 상당히 인기가 있죠. 하지만 때때로 이 단축키가 작동하지 않아 당황스러운 상황에 놓이는 경우가 있습니다. 오늘은 바로 이 문제의 원인과 해결 방법에 대해 자세히 알아보겠습니다. 문제의 원인: 한컴 입력기 설정 VS Code에서 Ctrl + / 단축키가 작동하지 않는 주된 원인은 바로 한국어 입력기 설정 때문입니다. 많은 한국 사용자들이 기본적으로 설정된 한컴 입력기를 사용하고 있는데, 이 입력기가 VS Code의 단축키와 충돌을 일으키는.. 2023. 11. 21.
css, html 코드 정리 사이트 c style, json, js javascript beautifier Tabifier css,html 코드 정리 사이트 c style,json,js javascript beautifier Tabifier 코드를 작성하는 것은 예술과 같으며, 마치 예술 작품을 전시하듯 코드도 깔끔하고 정돈된 형태로 보여주는 것이 중요합니다. 오늘은 여러분의 코드를 아름답게 정리해주는 몇 가지 유용한 웹사이트들을 소개하겠습니다. VS코드나, 이클립스 같은 IDE환경하에서는 뷰티파이어 플러그인을 쓰면 됩니다. 이런 코드 정리 사이트는 IDE가 설치 돼 있지 않은 환경하에서 지저분한 코드를 살펴봐야할 때 잠깐 사용하기에 편리합니다. 1. Tabifier: HTML 및 CSS 코드 뷰티파이어 웹사이트 링크: Tabifier 지원 언어: HTML, CSS Tools - Tabifier (HTML and CSS co.. 2023. 11. 7.
Deprecated된 VS Code 플러그인 확인하는 방법: Vs-code extension error: This extension is deprecated as it is no longer being maintained VS Code 확장 프로그램 오류: 이 확장 프로그램은 더 이상 유지 관리되지 않아 사용 중단되었습니다 Visual Studio Code(VS Code)는 개발자들에게 널리 사용되는 인기 있는 코드 편집기 중 하나입니다. 그러나 때로는 VS Code 확장 프로그램에서 오류나 문제가 발생할 수 있습니다. 이 글에서는 "이 확장 프로그램은 더 이상 유지 관리되지 않아 사용 중단되었습니다"라는 메시지와 함께 발생하는 특정 오류에 대해 다룰 것입니다. 이 오류는 확장 프로그램이 더 이상 업데이트되지 않거나 지원되지 않을 때 발생합니다. 문제의 원인 확장 프로그램이 더 이상 지원되지 않음: 확장 프로그램의 개발자가 더 이상 업데이트를 제공하지 않거나 지원을 중단한 경우 의존성 문제: 확장 프로그램이 의존하는 다른.. 2023. 10. 14.
vscode에서 PHP와 SCSS 함께 사용하기: SASS 컴파일러 설치 ✈ Visual Studio Code에서 PHP와 SCSS 함께 사용하기: SASS 컴파일러 설치 안녕하세요, 여러분! 오늘은 Visual Studio Code를 이용하여 PHP 프로젝트에서 SCSS를 사용하고 SASS 컴파일러를 설치하는 방법에 대해 알아보려고 합니다. 이 포스팅을 통해 웹 개발 과정에서 SCSS의 활용과 함께 SASS 컴파일러를 효율적으로 활용하는 방법에 대해 배워보세요. 준비물 확인하기 우선, 우리가 할 작업에 필요한 준비물을 확인해봅시다. Visual Studio Code 설치: VS Code가 설치되어 있지 않다면, 공식 웹사이트에서 다운로드하여 설치해주세요. SCSS 지식: SCSS는 웹 개발에서 스타일을 효과적으로 작성할 수 있도록 도와주는 언어입니다. 이미 기본적인 SCSS.. 2023. 9. 1.
vscode scss compiler sass 사용하는법 .map파일이 생성되지 않게 설정 vscode에서 SCSS 컴파일하여 .map 파일 생성 방지하기 소개 SCSS를 CSS로 컴파일하는 방법은 여러 가지가 있습니다. 이번 글에서는 Visual Studio Code에서 간편하게 SCSS를 컴파일하는 방법에 대해 알아보겠습니다. 필요한 확장 기능들과 함께 Live Sass Compiler를 이용하여 .map 파일 생성을 방지하는 방법을 소개하겠습니다. 필요한 확장 기능 설치 아래의 확장 기능들을 설치해야 합니다: sass sass Lint live sass compiler live server 설치가 완료되면 페이지 하단에 Live Sass Compiler와 유사한 아이콘이 표시됩니다. SCSS 파일 컴파일 Live Sass Compiler를 사용하여 SCSS 파일을 컴파일할 수 있습니다. .. 2023. 8. 30.
vscode Failed to load jshint library. 에러 처리 방법 어느 날 새 노트북에 vscode를 설치하고 각종 플러그인을 설정하는데.... 갑자기 output에 Failed to load jshint library. Please install jshint in your workspace folder using 'npm install jshint' and then press Retry. 라는 에러가 출몰한다. 결론부터 말하자면 문제의 원흉은 JSHint 플러그인 탓이다. The extension looks for a jshint module in the current directory and in the global package location. 이 vscode 확장 프로그램은 자바스크립트용 Linter역할을 하는 익스텐션이다. 기본적으로 vscode는 jshin.. 2021. 8. 6.
PowerShell] VSCode 터미널 오류 : 이 시스템에서 스크립트를 실행할 수 없으므로 ~ .ps1 파일을 로드할 수 없습니다 PowerShell] VSCode 터미널 오류 : 이 시스템에서 스크립트를 실행할 수 없으므로 ~ .ps1 파일을 로드할 수 없습니다. VSCode 에서 npm을 설치하고 사용하고자 할 때 아래와 같은 어려움에 부딪칠 수 있다. 이는 스크립트 실행 권한이 제한되어 있는 상태이기 때문이다. 스크립트 실행 권한을 변경하기 위해서는 Windows PowerShell을 관리자 권한으로 실행해서 변경해줘야 한다. 1. Windows PowerShell을 관리자 권한으로 실행 Window10 기준: 시작에서 windows PowerShell을 검색해서 관리자로 실행 2. get-help Set-ExecutionPolicy로 어떤 권한을 설정할 수 있는지 확인 Restricted : PowerShell의 실행 권한 .. 2021. 8. 3.
vscode php scss 사용하기 sass 컴파일러 설치 설치 가이드: VS Code에서 PHP 프로젝트에 SCSS 사용하기 및 SASS 컴파일러 설치 소개 안녕하세요! 이번 포스팅에서는 VS Code에서 PHP 프로젝트에 SCSS를 사용하는 방법과 SASS 컴파일러 설치에 대해 알아보겠습니다. VS Code는 앵귤러를 사용하던 분들도 SCSS를 편리하게 활용할 수 있는 좋은 도구입니다. SCSS는 브라우저가 직접 이해하지 못하기 때문에 SASS 컴파일러를 통해 CSS 파일로 변환해주어야 합니다. 이를 통해 개발자들은 편리하게 작업할 수 있습니다. 필요한 확장 설치 먼저, VS Code에서 SCSS를 사용하기 위해 필요한 확장을 설치해 보겠습니다. 다음 확장을 설치하면 SCSS 작업이 더욱 편리해집니다. Live Sass Compiler: 이 확장은 SCSS .. 2021. 7. 14.
vscode 파일 찾기 단축키, 프로젝트 내 특정 폴더 파일에서 찾기 - 문자열 검색 VS code 파일 찾기 단축키. VS코드에서 파일 익스플로러가 유용하지만, 프로젝트 규모가 커져서 폴더 구조가 복잡해지고 파일이 많아지면, 특정 파일을 찾을 때는 파일 찾기를 해야 한다. 왼쪽의 아이콘은 파일 내에서 특정 문자열을 찾아주는데 유용하지만, 파일 자체를 찾을 때는 파일 찾기를 해야 한다. 단축키는 보통 윈도우에서는 CTRL+P를 사용하면 유용하다. 리눅스에서도 많이 사용되는 단축키이므로 Ctrl+P로 외워두는 것이 용이하다. Windows vscode 단축키 Ctrl+E 혹은 Ctrl+P MAC용 vscode 단축키 Cmd+P 구형 MAC 단축키 Cmd+E Linux용 vscode 파일 찾기 단축키 Ctrl+P -blackun.com vscode 문자열 검색 프로젝트 내 특정 폴더 파일에서.. 2021. 7. 1.