6. Error

[ ActiveReportJs ] PDF파일로 저장시, 한글 폰트 깨지는 문제

문제 Uncaught (in promise) SyntaxError: Unexpected token ' 분석경로 이슈 정리리액트에서 경로는 public을 기준으로 처리됩니다.기준이 잡힌 상태로 처리되기 때문에 경로에서 public은 제외해야 합니다.// /public/fontsConfig.json에서 폰트를 가져옵니다.Core.FontStore.registerFonts('/public/resources/fontsConfig.json');만약 위와 같이 경로를 제대로 입력하지 못하면 404에러가 발생하고, 리액트 라우터가 홈 화면으로 리디렉트 시킵니다. → 잘못된 주소를 입력한 경우 리액트 라우터가 home으로 리디렉트 시킴콘솔에서 HTML 문법 오류가 생긴 것도 json 파일 경로가 잘못되어 리액트 라우터..

2024. 9. 9. 11:32

6. Error

[ ActiveReportsJs ] PDF 다운로드 구현과정 getDocument 매서드 문제

구현하고자 하는 기능Reort를 PDF로 저장하는 기능 (공통으로 사용하는 기능으로, props로 받아서 공통화함)문제Viewer의 getDocument매서드를 불러오는데, 없다는 에러가 뜬다import React from 'react';import { Viewer } from '@grapecity/activereports-react';import { PdfExport, HtmlExport, TabularDataExport } from '@grapecity/activereports';// DownloadButtonProps 인터페이스 정의interface DownloadButtonProps { reportUrl: string; // 보고서 URL viewerRef: React.RefObject; //..

2024. 9. 4. 16:44

6. Error

[ ActiveReportsJs ] PDF 다운로드 구현과정 모듈 에러문제

구현하고자 했던 기능 Report를 PDF로 다운로드 하는 기능문제https://demo.mescius.co.kr/activereportsjs/docs/DeveloperGuide/api/printing-and-exporting-the-report-output ActiveReportsJS: 소개 demo.mescius.co.kr공식문서를 참고하여 PDF 다운로드 버튼 구현하는 과정에서 모듈 에러문제가 발생했다모듈 에러는 정말 난감한게....내가 잘못한거없고ㅠ 내부적 문제로 하나하나 찾아봐야한다는 점이다에러 문구ERROR in ./src/components/Report/pdfUtils.ts 19:23-38export 'Core' (imported as 'Core') was not found in '@mesc..

2024. 9. 4. 16:30

6. Error

[ Active Reports JS ] React내에서 렌더링 안되는 404 에러

1. 에러 현상 및 원인이거를 토대로 따하하는데, 아래와 같은 에러가 난다…|https://demo.mescius.co.kr/activereportsjs/docs/GettingStarted/QuickStart/QuickStart-Vitejs ActiveReportsJS: 소개 demo.mescius.co.krmessage:"Report \"/trade.rdlx-json\" is not available: Failed to fetch"activereports를 사용하고 있는데 위와같이 에러가 뜨고 레포트 렌더링이 안되고있음  2. 해결현재 경로가 http://localhost:3000/config/business/bond-type-registration 으로 들어가고 있는데, 이거에 맞춰서 public파일..

2024. 9. 2. 10:48

6. Error

[eslint] is defined but never used

개발 환경 : typescript + React eslint 설정을 해뒀는데, 자꾸 에러가 떠서 뭐지 하고 찾다가 해결하여 작성함발생 이유에러를 미리 작성해놓고 적용하지 않았을 때 등장, 이외에도 선언만 하고 사용, 호출하지 않은 변수나 함수들도 no-unused-vars 규칙에 걸리게 됨기존에 있던 eslint{ "parser": "@typescript-eslint/parser", "plugins": ["@typescript-eslint"], "extends": ["plugin:@typescript-eslint/recommended"], "parserOptions": { "ecmaVersion": 2021, "sourceType": "module", "ecmaFeatures": ..

2024. 6. 13. 14:55

6. Error

[CORS] The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCredentials attribute.

에러 내용Access to XMLHttpRequest at 'https://api.app.com/scm/v1/login' from origin 'http://localhost:3000' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: The value of the 'Access-Control-Allow-Credentials' header in the response is '' which must be 'true' when the request's credentials mode is 'include'. The credentials mode of requests initiated b..

2024. 5. 30. 16:08

6. Error

[Next] window is not defined

암장예약?하는 사이드 프로젝트에서 next.js 를 사용하고, 카카오맵을 사용한다. 기능으로 현재 위치를 파악하고 위치표시를 하는데 navigator.geolocation을 사용하면 된다는 것을 알게 됨 아래와 같이 Location을 불러오는 함수를 만들고 카카오맵쪽에서 불러오는 방식으로 사용함 /* eslint-disable lines-around-directive */ 'use client'; import { useEffect, useState } from 'react'; export default function Location() { const [location, setLocation] = useState..

2024. 3. 19. 15:55

6. Error

[Error] Next14 Styled-Component 에러

ISSUE Next.js에서 styled-components로 작성한 Theme Provider를 전달하였더니 다음과 같은 에러가 나타나며 실행이 되지 않았습니다. next-dev.js Warning: Prop `className` did not match. Server: '어쩌구저쩌구' Client: '어쩌구저쩌구' REASON NextJS는 초기 렌더링만 서버가 담당(SSR)하고 그 이후에는 서버를 거치지 않은 채 내부 라우팅을 이용해 페이지가 이동되면서 브라우저에서 렌더링(CSR)을 하게 됩니다. 첫 화면 로딩시에는 SSR로 렌더링하면서 오류가 발생하지 않지만 그 이후 부터는 CSR로 렌더링하면서, 서버에서의 클래스명과 클라이언트에서 클래스명이 달라져서 생기는 오류입니다. SOLUTION 해결 방법..

2024. 3. 7. 17:54

6. Error

[Error] Next14 - invariant expected app router to be mounted, The above error occurred in the <HotReload> component

Uncaught Error: invariant expected app router to be mounted The above error occurred in the component: 두 에러가 떴다 해결 layout.js에 html은 있는데, body태그를 삭제해서 일어난 에러 html태그와 body태그가 필수로 있어야함

2024. 3. 7. 14:39

6. Error

[Error] Cannot find module 'react' or its corresponding type declarations

1.에러 발생 상황 React를 실행하려는데 다음과 같은 에러가 발생했다 react와 react-dom이 존재하지 않는다는 문제 2.해결방법 직접 react와 react-dom을 설치해 에러를 해결했다 npm i react react-dom

2024. 2. 7. 15:06

6. Error

[Next Error] Uncaught Error: invariant expected app router to be mounted_navigation.js:144

위와 같은 에러가 뜬다..힝.. 해결 layout.ts에 and tag가 없어서 나타나는 에러였다. 왜냐면 전 코드는 아래와 같이 넣었기때문에 그런거같다 안에 있는 body태그를 뺐더니 정상작동함 'use client'; import React, { useEffect } from 'react'; import './globals.css'; import GlobalStyle from './styles/global-styles'; import Header from './_components/header'; import useHasMounted from '../useHasMounted'; import { ThemeProvider } from 'styled-components'; import { theme } f..

2023. 11. 22. 11:16

6. Error

[Error] yarn dev할때, ReferenceError: performance is not defined오류

문제 웹사이트 만들고 gitHub에 올린 후 내 개인 노트북으로 clone받고, yarn install 하고 yarn dev를 하려했더니 아래와 같은 오류가 난다..대략난감 imhyeonjeong@imhyeonjeongs-MacBook-Air  ~/Desktop/LIM-HYUN-JEONG   main ±  yarn dev yarn run v1.22.19 $ next dev /Users/imhyeonjeong/Desktop/LIM-HYUN-JEONG/node_modules/next/dist/bin/next:57 performance.mark("next-start"); ^ ReferenceError: performance is not defined at Object. (/Users/imhyeonjeo..

2023. 11. 21. 23:14

6. Error

[Error] @react-three/drei 관련 에러

./node_modules/@react-three/drei/core/Text3D.js Error: × Unexpected token `...`. Expected yield, an identifier, [ or { ╭─[C:\Users\82103\Desktop\hyunjeong\node_modules\@react-three\drei\core\Text3D.js:60:1] 60 │ */ 61 │ const { 62 │ 0: label, 63 │ 1: ...rest · ─── 64 │ } = useMemo(() => getTextFromChildren(children), [children]); 65 │ const args = React.useMemo(() => [label, opts], [label, opts]..

2023. 11. 21. 16:54

6. Error

[Error] Can't perform a React state update on an unmounted component

Warning: Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application. To fix, cancel all subscriptions and asynchronous tasks in a useEffect cleanup function. 경고: 마운트 해제된 구성 요소에 대해 반응 상태 업데이트를 수행할 수 없습니다. 이는 사용자의 프로그램에서 메모리가 누출되었음을 나타냅니다. 수정하려면 useEffect 정리 기능에서 모든 구독 및 비동기 작업을 취소합니다. 해결방법 데이터 가져오기 또는 기타 비동기 작업은 Promise를 반환한다...

2023. 11. 14. 13:22

6. Error

[Warning] Cannot update a component (`BrowserRouter`) while rendering a different B component. To locate the bad setState() call inside `B component `, follow the stack trace as described

에러메세지 Warning: Cannot update a component (`A : BrowserRouter`) while rendering a different component (`B : 컴포넌트이름`). To locate the bad setState() call inside ` 컴포넌트이름 `, follow the stack trace as described in https://reactjs.org/link/setstate-in-render Bug: too hard to fix "Cannot update a component from inside the function body of a different component." · Issue #18178 · face Note: React 16.13...

2023. 11. 10. 15:05

6. Error

[SSR] ":nth-child is potentially unsafe" warning

1️⃣ 원인 : Next.js(SSR)에서의 nth-child경고문 SSR에서 nth-child를 사용하는것은 안전하지 않다 ➡️ nth-child를 nth-of-type으로 변경을 해라. 2️⃣ 해결 : nth-of-type으로 변경 1) 발생 이유 SSR이 구성요소를 렌더링 할 때, 스타일 요소도 함께 렌더링이 된다. 그로인해 nth-child을 사용하면 의도하지 않은 동작으로 될 수 있기에 안전하지 않다는 경고문이 뜬것이다. 2) 두가지는 어떻게 다른지? 2-1) nth-child https://developer.mozilla.org/ko/docs/Web/CSS/:nth-child nth-child(N) = 부모안에 모든 요소 중 N번째 요소 (MDN) - sibling목록에서, 선택하려는 요소의 ..

2022. 9. 19. 09:55