본문 바로가기

분류 전체보기

svg 가로, 세로 css로 적용 안되는 이슈 해결방법 1. svg 태그의 width, height 속성을 제거한다. 2. svg 태그에 아래의 속성 추가
ios에서 textarea maxLength 이슈 일반적으로 텍스트 영역에 줄 바꿈 문자를 입력하면 1자로 계산될 것으로 예상할 수 있다. 그러나 ipad 또는 iphone에서 maxlength 속성은 줄 바꿈 문자를 두 문자(\r\n)로 간주하므로 maxlength로 문자 수를 제한하는 데 이슈가 있다. 해결방법 maxlength로 글자수를 제한하지 않고, 직접 글자 수를 체크해서 잘라서 써야한다. const onChange = (e: React.ChangeEvent) => { const value = e.target.value; if (value.length > MAX_LENGTH) { e.target.value = value.substring(0, MAX_LENGTH); } };
Support for password authentication was removed on August 13 8월 13일 부로 push, clone, pull 시 비밀번호 대신 토큰을 사용하게 변경 되었기 때문에 git push시 아래와 같은 에러가 발생한다. Support for password authentication was removed on August 13 mac에서는 아래 링크대로 하면 해결된다. 요약하자면, 1. github -> profile -> Developer settings -> personal access tokens -> Generate new token -> 토큰 생성 2. 토큰을 복사해서 keychain을 열고 github.com 암호를 복사한 토큰으로 update 3. 터미널에서 git push https://whatibroke.com/2021/08/14/support-for-p..
rollup으로 번들한 모듈 Can't resolve ./index.scss rollup으로 번들한 모듈에서 Can't resolve ./index.scss 에러 발생 문제가 되는 코드 const style = require('./index.scss'); 해결 import style from './index.scss';
브라우저에서 뒤로 버튼을 사용할 수 있는지 여부 체크하는 방법 결론: 할 수 없다. 기술적으로 history.previous을 확인하는 정확한 방법이 있습니다. history.previous 그러나 작동하지 않습니다. 대부분의 브라우저에서 history.previous를 보안 위반으로 간주하고 일반적으로 undefined을 반환합니다. 다른 사람들은 아래와 같은 방법을 제안하지만.. history.length 그러나 length는 당신이 history에서 어디에 있는지를 나타내지 않기 때문에 완전히 작동하지 않습니다. 또한 항상 같은 숫자로 시작하는 것은 아닙니다. 예를 들어 랜딩 페이지를 갖도록 설정되지 않은 브라우저는 0에서 시작하는 반면 랜딩 페이지를 사용하는 다른 브라우저는 1에서 시작합니다. 이슈 재현 1. https://~ 새창으로 열기 2. 이전 버튼 ..
Next.js "window,document is not defined" 해결하는 법 https://sumini.dev/issue/000-nextjs-window,document-is-not-defined/ Next.js "window,document is not defined" 해결하는 법 Next.js 개발환경에서 window object를 사용할 때, document is undefined, Cannot read innerWidth of undefined 등의 에러메세지를 마주할 때가 있다. Next.js… sumini.dev
[next.js] setting init 1. 터미널에 명령어를 순서대로 작성 nvm use 14.15.5 yarn init -y yarn add react react-dom next 2. package.json "scripts": { "start": "next" "build": "next build" }, pages 폴더 생성 pages 폴더 생성해서 index.tsx 파일 만들기 scss loader 설정 yarn add classnames sass --save --dev [파일명].module.scss typescript 1. 루트 디렉토리에 next-env.d.ts 파일을 만들기 2. package 설치 yarn add --dev typescript @types/react @types/node 3. 파일들을 .tsx 파일로 변경..
[next.js] 맵핑되지 않는 라우터 404페이지 노출 대신 redirect 하는 법 pages/404.js import { useEffect } from "react" import { useRouter } from "next/router" import { TEMPLATE_MODEL } from "../common/constants/Template"; export default function Custom404() { const router = useRouter() useEffect(() => { router.replace(`/${TEMPLATE_MODEL}`); }) return null }