FEB:)DAIN

https://stackoverflow.com/questions/64933543/parsing-error-cannot-read-file-tsconfig-json-eslint Parsing error: Cannot read file '.../tsconfig.json'.eslint The error Parsing error: Cannot read file '.../tsconfig.json'.eslint shows in all .ts files in the src folder including index.ts. I have no idea how to set up configs. The issue just shows a red li... stackoverflow.com 위 링크에 들어가면 Parsing erro..

React를 이용해 프로젝트를 하면서 제목과 같은 오류를 맞닥뜨렸다면 index.html 파일로 들어가 manifest 부분을 확인하면 된다. 만약 manifest.json 파일을 사용하지 않는다면 아래와 같은 코드를 지우면 된다. // index.html 하지만 PWA를 위해 manifest.json을 사용해야 한다면 3가지를 확인해야 한다. 1. 경로/오타 문제 rel="manifest" href="manifest.json" ✅️ [rel] "manifest"라고 잘 적혀있다. ✅️ [href] 올바른 경로로 설정되어있다. (index.html과 manifest.json이 같은 폴더 안에 있다면, manifest.json 파일 안 start_url이 "/"이라면 위의 경로가 맞다.) ⚠️ index...

var stringWidth = require('string-width') ^ Error [ERR_REQUIRE_ESM]: require() of ES Module ... code: 'ERR_REQUIRE_ESM' yarn storybook을 하니 갑자기 이러한 문제가 발생했다.🤔 절대 경로를 설정하다가 맞닥뜨린 에러라 절대 경로 때문인가 했더니 아니었다. 해결 방법은 다음과 같다. // package.json { ... "resolutions": { "jackspeak": "2.1.1" } } package.json 파일 안에 위 코드를 넣어도 오류가 날 경우, node_modules, yarn.lock을 지우고 다시 설치해 주면 된다. rm -rf node_modules yarn.lock yarn 다..

MSW란? Mock Service Worker의 약자로 API를 Mocking 할 때 사용하는 도구 API 요청을 가로채는 Service Worker 기능을 사용하여 mocking 할 수 있다. 로컬 서버는 key를 입력해서 들어가야 하는 등 번거로움이 있어 스토리북을 통해 개발을 하고 있었다. 그러던 중 API mocking이 필요해졌고, msw와 스토리북을 연동하기 위해 msw-storybook-addon을 설치했다. npm i msw-storybook-addon -D // or yarn add msw-storybook-addon -D 하지만 스토리북에서 msw가 잘 작동하지 않았다.🥲 TypeError: Failed to update a ServiceWorker for scope ('http://l..

Failed to execute 'createElement' on ... 오류가 났을 때, 아래의 순서대로 진행하면 된다. 1. @svgr/webpack 설치 yarn add -D @svgr/webpack // or npm install --save-dev @svgr/webpack 2. d.ts 파일에 코드 추가 원래 d.ts 파일에 `declare module '*svg' 만 있었는데 아래 코드를 추가해 주었다. // assets.d.ts declare module '*.svg' { import React = require('react'); export const ReactComponent: React.FunctionComponent; const src: string; export default src..

2023.07.04 - [코딩/공부] - 깃 커밋 메시지에 이슈 번호를 자동으로 입력할 순 없을까? 깃 커밋 메시지에 이슈 번호를 자동으로 입력할 순 없을까?프로젝트 브랜치명 컨벤션이 feat/이슈번호여서, 브랜치명에서 이슈번호만 가져온 다음 커밋할 때마다 커밋 메시지 아래단(footer)에 이슈 번호를 자동으로 입력해주고 싶었다. 자동으로 입력된다feb-dain.tistory.com 2023.07.19 - [기록/프로젝트 카페인] - husky로 prettier, eslint 적용 자동화하기 husky로 prettier, eslint 적용 자동화하기가끔 팀원 중 한 명이 prettier 적용을 하지 않고 push하는 일이 있었다. 그래서 이런 실수를 아예 방지하기 위해 husky를 이용해 prettie..

import React from 'react'는 리액트 17부터 생략 가능하지만, CRA 없이 처음 환경 설정을 하다가 생략이 안 되는 문제가 발생했다. 1. 타입 에러아래와 같은 타입 에러는 'React' refers to a UMD global, but the current file is a module. Consider adding an import instead.ts(2686) tsconfig.json에서 { "compilerOptions": { ... "jsx": "react" }"jsx": "react"를 "jsx": "react-jsx"로 바꿔주면 된다.{ "compilerOptions": { ... "jsx": "react-jsx" } 🤔 왜 이렇게 하면 생략이 가능할까?"compilerO..