manifest.json "background": { "service_worker": "background.js" },"permissions": [ "tabs",... background.jschrome.runtime.onMessage.addListener((request, __, sendResponse) => { console.log("Received message:", request); // 메시지 처리 로직 if (request.action === "doSomething") { console.log("Action performed."); sendResponse({ status: "success" }); } else { sendResponse({ status: "..
Failed to load module script: Expected a JavaScript module script but the server responded with a MIME type of "text/html". Strict MIME type checking is enforced for module scripts per HTML spec. vite에서 배포하고 /details/1, /edit/1 이런 :id를 받는 곳에서 새로고침을 하거나 새 탭으로 접속할 때 흰 화면이 나오면서 해당 에러가 나왔었다. 그래서 vercel 배포 문제인줄 알고 netlify로 바꾸기도 했었지만 그대로이길래 구글링을 통해서 해결방법을 찾았어요. 기존에는 base가 '.' 으로 되어있었는데 '/'으로 고치고 난 뒤 ..
맥에서 소프트웨어 업데이트를 하고 난 뒤 기존에 잘 사용하던 소프트웨어가 정상적으로 작동하지 않는 경우가 있습니다. 아래의 명령어를 통해서 해결해야 합니다 에러 메세지 xcrun: error: invalid active developer path (/Library/Developer/CommandLineTools), missing xcrun at: /Library/Developer/CommandLineTools/usr/bin/xcrun xcode 명령어를 터미널에 입력해줍니다.xcode-select --install 참고자료 Mac 업그레이드 후 xcrun: error: invalid active developer path 에러 해결하기MacOS 업그레이드 시 어김없이 발생하는 문제가 하나 있..
시작하기 주소 https://dash.cloudflare.com/ 리사이징은 무료이고 20여 가지의 사이즈로 변경하여 조회할 수 있다고 합니다. 저장 시 저장소는 10만 이미지 당 5달러입니다. 조회 시 10만 이미지 당 1달러입니다. 이미지 업로드 API docs 읽기 아래의 3가지 문서를 참고했습니다. Make your first API request · Cloudflare Image Optimization docs To make your first request to the Images API, you must obtain these pieces of information: developers.cloudflare.com Direct Creator Upload · Cloudflare Image Opt..
원인 prismaclient가 이미 존재하는데도 계속 만들어내서 일어나는 에러로 추정합니다 기존의 코드 import { PrismaClient } from '@prisma/client'; const prisma = new PrismaClient(); export default prisma; 수정한 코드 import { PrismaClient } from '@prisma/client'; declare global { var prisma: PrismaClient | undefined; } const prisma = global.prisma || new PrismaClient(); if (process.env.NODE_ENV === 'development') global.prisma = prisma; expo..
request.json의 값을 타입 지정하고 싶었습니다. 검색하여서 적용한 방법. (NextApiRequest를 확장하여 사용하는 방법) interface CategoryApiRequest extends NextApiRequest { body: { name: string; description?: string; }; } export async function POST(request: CategoryApiRequest) { const { name, description } = request.body; 비슷하게 생긴 NextRequest와 NextApiRequest 둘의 차이가 무엇인지 알아보려고 합니다. NextRequest Request는 NodeJs의 Request를 확장하여 만든 클래스였습니다. 그래..
NextJS 14 api route handler를 만들고 endpoint test를 한 과정을 기록했습니다. 0. 테스트 패키지 선정 먼저 NextJS를 테스트하기 위해 사용되는 패키지를 찾아보았습니다. 처음에 supertest가 제일 유명하고, gpt에게도 추천받아서 설치했습니다. chai-http vs mock-req-res vs node-mocks-http vs supertest | npm trends Comparing trends for chai-http 4.4.0 which has 349,053 weekly downloads and unknown number of GitHub stars vs. mock-req-res 1.2.1 which has 20,204 weekly downloads and..
Husky를 이용하여 테스트 자동화 하는 이유 깃 action에서도 테스트 자동화를 할 수 있지만 월 2,000분만 무료로 제공하기 때문에 잦은 PR을 올리거나 테스트 개수가 많아졌을 때 비용이 들 수 있습니다. 그래서 push 혹은 commit 하기 전 로컬에서 테스트가 실패하거나 불필요한 코드가 같이 PR에 올라가는 지 확인하는 것이 좋다고 생각이 들었습니다. GitHub Actions 요금 청구 정보 - GitHub Docs 계정에 포함된 스토리지 또는 시간(분)을 벗어나 GitHub Actions를 사용하면 추가 사용량에 대한 요금이 청구됩니다. docs.github.com 설치 npm install husky --save-dev npm install --save-dev lint-staged hu..
- Total
- Today
- Yesterday
- 노마드코더
- electron
- 북클럽
- createPortal
- 윤성우 열혈C프로그래밍
- WSL2
- nodejs
- 아차산
- 원티드
- C언어
- javascript
- TopLayer
- React
- 초보
- env
- 우아한테크코스
- jest
- Storybook
- 프론트앤드
- 프리온보딩
- error
- CLASS
- NextRequest
- 스토리 북
- 노개북
- import/order
- nextjs
- NextApiRequest
- 위코드
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | |||||
3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 | 29 | 30 |