TOOL (74) 썸네일형 리스트형 [intelliJ] SCSS 사용하기위한 환경설정 intelliJ에서 SCSS를 CSS로 컴파일 하기 위한 방법은 다음과 같다. 윈도우 기준 ctrl+alt+S -> Settings 창을 띄워 Plugins에 File Watchers 설치 (그전에 node.js와 npm으로 sass를 전역으로 설치해야함) -> Settings 창에서 Tools > File Watchers 왼쪽 + 클릭후 SCSS 추가 및 더블클릭 후 아래와 같이 창이 나타나고 아래처럼 설정을 해준다. [VSCode] 자동 formatter 플러그인 소개 https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode Prettier - Code formatter - Visual Studio Marketplace Extension for Visual Studio Code - Code formatter using prettier marketplace.visualstudio.com React.js 공부를 하는 도중 VScod 플러그인 중 JSX (Javacript를 확장한 문법으로 HTML에서 사용한 문법과 흡사)를 입력하고 저장했을 시 자동 formatter 해주는 플러그인을 발견해서 소개하고자 한다. 1. VSCode 플러그인 : Prettier - Code formatter 검색 후 .. [VSCode] Sass Live Complie 설정하기 SASS를 VSCode에서 사용하기 전에 몇가지 셋팅이 필요하다. 1. 어떤 파일을 컴파일 할것인가? 2. 컴파일한 css는 어떤 형태로, 어디에 저장할 것인가? 3. 오토프리픽스 즉, 브라우저 마다 지원하는 스타일로 변환을 할 것인가? 4. 컴파일시 .map 파일도 추가할 것인가? 1. 답 : 여기서는 style.scss만 컴파일 할것이다. 2. 답 : 여기서는 compressed(압축으로 기본 min 확장자명을 가진 파일)로, scss파일이 위치한 동일 선상에 저장할 것이다. 3. 답 : O 4. 답 : X .map파일은 추후 이 클래스의 스타일이 어디에 위치해있는지 보여주는 파일로 유용하게 쓰이기도 한다. [설치할 플러그인] Sass Live Sass Compiler [셋팅 방법] 왼쪽 하단 톱니바.. [VSCode] Sass Live Compile 설정하기 sass를 사용하기위해서 몇가지 셋팅이 필요하다. 컴파일을 할때 어떠한 형식의 css로 컴파일을 할것인지부터 시작해서 어떤 특정 scss파일만 도출해 낼것인지까지 다양한 옵션으로 셋팅이 가능하다. 1. 플러그인 live sass compiler와 Sass 설치하기 2. 불필요한 공백 모두 제거(compressed)와 특정 파일 main.scss, sub.scss만 컴파일 하며 오토프리픽스로 크로스브라우징(브라우저별 인식 코드 자동 삽입)을 할 예정이다. ex) display: flex;만 작업자가 scss에 작성하여도, 자주 사용하는 브라우저들의 프리픽스를 선언하여 인식할 수 있게 해준다. display: flex;를 컴파일한 결과는, display: -webkit-box; display: -ms-fle.. [VSCode] 기본 셋팅 리스트 및 플러그인 위치 VSCode를 새로 셋팅할 때마다 처음부터 플러그인을 하나하나 Install 할 필요 없이 extensions 폴더를 저장하여 필요할 때마다 폴더를 붙여넣어주면 된다. 그리고 현재 내 작업 Windows 환경의 VSCode 확장 플러그인을 백업해둘 용도의 포스팅이기도 하다. 보통 윈도우에서 extensions 폴더 위치는 C:\Users\Users_name\.vscode\extensions에 있다. 아래가 현재 내 로컬 VSCode의 확장 플러그인이다. [SVG] svg window 미리보기 윈도우 환경에서 svg 이미지 파일을 미리보기란 쉽지 않다. 1. 탐색기에서 오른쪽 마우스> 보기> 큰아이콘 으로 설정 해두기 2. 아래 깃허브 레파지토리에 있는 .exe를 다운받아 실행하기 https://github.com/tibold/svg-explorer-extension/releases Releases · tibold/svg-explorer-extension Extension module for Windows Explorer to render SVG thumbnails, so that you can have an overview of your SVG files - tibold/svg-explorer-extension github.com 자신 로컬환경에 맞는 비트.exe를 골라 저장 및 실행한다. .. [VSCode] Tab 간격 설정 해둔데로 유지하기 프로젝트마다 Tab 간격 설정이 달라서 매번 우측 하단에 Tab Size 혹은 Sapcing을 변경해줘도 창을 닫고 다시 vscode를 실행하면 다르게 설정 값이 매겨진다. 한번 설정 해둔데로 유지하고 싶다면, 1. 좌측 하단 톱니바퀴(또는 File > Preferences > Settings) 2. editor tab 검색 3. Detect Indentation 체크가 되어있다면 아래 캡처본처럼 해제 4. Editor Tab Size를 설정해주고 재실행한다. 😊 [github] ssh 공개키로 github 연결하는 이유 github 레파지토리를 로컬에 연결할경우 https 와 ssh 둘 중 하나의 방법으로 remote하곤 했었다. ssh는 키를 이용하여 해당 로컬에 연결하는 것인데, 이 방법을 택하여 연결하는 필요성이 와닿진 않았다. 보완상 좋다? 라고만 구글링해도 나와서... 하지만 단체 및 내 계정의 레파지토리를 로컬에 연결하여 터미널로 풀, 커밋 및 푸시를 날리고 싶을 경우 자꾸만 아래와 같은 에러를 뿜었다. remote: Repository not found. fatal: repository 'https://github.com/vsquaregit/Publish-DEMO.git/' not found 잘 생각해보면, 내계정 즉, 내가 주인이 아닌 계정에 만든 레파지토리 즉, 단체에서 날 초대하여 Admin 권한을 준.. 이전 1 2 3 4 5 6 ··· 10 다음
