Network&etc/vscode&package.json (19) 썸네일형 리스트형 Error [ERR_REQUIRE_ESM]: require() of ES Module 해결 Error [ERR_REQUIRE_ESM]: require() of ES Module /Users/yujin/caveduck/caveduck/proj.www/node_modules/json-with-bigint/json-with-bigint.js from /Users/.../node_modules/@qdrant/openapi-typescript-fetch/dist/cjs/fetcher.js not supported. Instead change the require of json-with-bigint.js in /Users/.../node_modules/@qdrant/openapi-typescript-fetch/dist/cjs/fetcher.js to a dynamic import() which is av.. yarn berry + nextjs install yarn berry install Nextjs, eslint, prettier, sass Yarn berry if you don't have yarn yet npm i -g yarn install react or react typescript anything you want yarn create next-app and change set to berry version yarn set version berry checkout the file location and if you open location, press ctrl+ '.yarn/releases/yarn-3...' find .yarnrc.yml and remove nodeLinker: node-modules and add yarnPa.. RestClient - postman 쓰기 귀찮다면 API호출할때 브라우저띄워서 호출하기 귀찮을때가있다. 나같은 경우는 포스트맨가서 로그인하고 뭐하고 뭐하고가 너무 귀찮은데 마침 Rest Client라는 vscode extentions가 있어서 이용해보았다. Rest Client는 API 호출 결과를 에디터상에서 볼수있는 기능을 제공한다. 사용예시 파일명.http ### GET https://example.com/comments/1 HTTP/1.1 ### GET https://example.com/topics/1 HTTP/1.1 ### POST https://example.com/comments HTTP/1.1 content-type: application/json { "name": "sample", "time": "Wed, 21 Oct 2015 18:2.. Live Sass Compiler 자동변환 컴파일러 - VScode익스텐션 익스텐션 설치후에 scss파일을 작성한다음에 배포전에 하단에 watch Sass를 클릭해주면 css와 css.map이라는 파일이 자동으로 변환되어 생성됨! 장점이자 단점은 css로 수정한내용이 scss에서는 반영이안되는것같다. REST Client REST Client 브라우저를 통하지않고 vs코드 내에서 API 타이핑 혹은 API를 테스트할때 좋음 ## RESTful API 주소 send request버튼을 누르면 응답결과가 나옴 prettier,ESLint,typescript 설치방법 + 저장시 자동실행 추가 default formatter가 preference에 안보여서 유투브를 찾아보았다. 단축키로 해결! 맥: option shift f -- 1. extention 설치:Prettier, Prettier ESLinst 2.터미널입력 npm install --save-dev prettier npm install --save-dev eslint npm install --save-dev eslint-config-airbnb-base eslint-plugin-import npm install --save-dev eslint-config-prettier npm install --save-dev eslint-plugin-node npm install --save-dev typescript npm install .. [vscode] 타이틀바 컬러바꾸기 프로젝트를 여러개띄울때 각각 컬러를 다르게 할수있다. 구별할때 유용할듯! F1 - Preferences:open settings(UI) 검색 Workbench - Appearance 메뉴를 선택하고 Color Customizations에 Edit in settings.json파일 클릭 "workbench.colorCustomizations": { "titleBar.activeBackground": "#fff", "titleBar.inactiveForeground": "#fff" } 자동으로 추가 생성되는 workbench.colorCustomizations안에 위와같은 코드를 넣고 컬러만변경! Visual Studio 탭정렬 tab 코드를 시각적으로 잘보이게하기위해 들여쓰기가 항상필요하다. 간혹 탭버튼을 눌렀으나 스페이스바로 들여쓰기가 되어있는경우가있는데 스페이스바의경우 들여쓰기보다 메모리가 더든다고한다. 스페이스바 대신에 탭정렬 설정으로 변경해보자. 1. 수동 설정 하단에 tab size 혹은 space를 누르면 변경이가능하고 몇칸이동할수있는지 선택할수있다. 하지만 이방법은 default값이 space인 경우 매 파일생성시마다 설정해줘야하는 번거로움이 있다. 2. 설정 파란색 Editor:Tab Size를 2~4로 설정하되 Editor:Insert Spaces는 체크를 해제하고 마지막으로 Detect Indentation도 체크가 되어있다면 해제해준다. 3. 적용 스페이스바된 줄을 블록지정한뒤에 shift+tab, tab을 통해 .. 이전 1 2 3 다음
