Error

Function declared in a loop contains unsafe references to variable(s)

F

문제상황 run = (timeout: number) => new Promise<void>((resolve) => { let direction = 'r'; const todos = []; for (let i = 0; i < 15; i += 1) { if (i === 6) direction = 'l'; if (i === 10) direction = 'r'; todos.push(() => { this.dragonBGmove(`${direction + 4}`, timeout); }); todos.push(() => { this.dragonBGmove(`${direction + 3}`, timeout); }); } resolve(); }); 7,8번째 줄에서 다음과 같은 에러가 뜬다. Function...

Module not found: Error: Can’t resolve ‘./keyboard’ in ‘..\Desktop\tetris\src’

M

문제상황 keyboard.ts파일에 Keyboard class를 만들고, export했다. main.ts파일에서 keyboard.ts파일을 import했는데 다음과 같은 에러가 나왔다. Module not found: Error: Can't resolve './keyboard' in 'C:\Users\W24946\Desktop\tetris\src' 내 코드 keyboard.ts class Keyboard { ..... } export default Keyboard main.ts import './style.css'; import Keyboard from './keyboard'; const a = new Keyboard(); 해결방안 찾기 webpack.config.js 파일에 문제가? webpack에서...

code ELIFECYCLE errno 1

c

문제상황 typescript와 webpack을 같이 사용하려고 했다. webpack, webpack-cli, webpack-dev-server를 devDependencies로 깔고 typescript는 global로 깔았다. 근데 build해보니까 아래와 같은 에러가 났다. ./src/main.ts 1.01 KiB [built] [code generated] 1 ERROR in child compilations webpack 5.4.0 compiled with 1 error in 1919 ms npm ERR! code ELIFECYCLE npm ERR! errno 1 npm ERR! tetris@1.0.0 build: `webpack` npm ERR! Exit status 1 npm ERR! npm ERR...

option ‘–open ‘ argument missing

o

문제상황 webpack, webpack-cli, webpack-dev-server를 깔고, 공식사이트에 나온대로 webpack serve --open 를 쳤다. 근데 다음과 같은 에러가 나왔다. error: option '--open <value>' argument missing npm ERR! code ELIFECYCLE npm ERR! errno 1 npm ERR! hooks@1.0.0 start: `webpack serve --open` npm ERR! Exit status 1 npm ERR! npm ERR! Failed at the hooks@1.0.0 start script. npm ERR! This is probably not a problem with npm. There is likely...

Promise executor functions should not be async

P

문제상황 function ready() { return new Promise<void>((resolve) => { console.log('game ready'); resolve(); }); } function end() { return new Promise<void>(async (resolve) => { await matrixReset(); resolve(); }); } function matrixReset() { return new Promise<void>((resolve) => { setTimeout(() => { console.log('matrix is reset!!'); resolve(); }, 2000); }); } async function over() { await end();...

Function declared in a loop contains unsafe references to variable(s)

F

문제상황 run = (timeout: number) => new Promise<void>((resolve) => { let direction = 'r'; const todos = []; for (let i = 0; i < 15; i += 1) { if (i === 6) direction = 'l'; if (i === 10) direction = 'r'; todos.push(() => { this.dragonBGmove(`${direction + 4}`, timeout); }); todos.push(() => { this.dragonBGmove(`${direction + 3}`, timeout); }); } resolve(); }); 7,8번째 줄에서 다음과 같은 에러가 뜬다. Function...

Property ‘xxxx’ does not exist on type ‘MyComponent’

P

class MyComponent extends Component<Props,States> {
constructor(props: Props) {
super(props);
this.spells = 'abc'
}
}

javascript였다면 spells를 추가하는게 문제가 안되는데, typescript에서는 내 맘대로 프로퍼티를 추가하면 안된다. MyComponent라는 타입에다가 먼저 spells라는 프로퍼티가 들어갈것이라고 알려줘야한다.

class MyComponent extends Component<Props,States> {
constructor(props: Props) {
super(props);
this.spells = 'abc'
}
}

Uncaught Error: Maximum update depth exceeded

U

배경설명 reactreact-routergraphqljwt 관리자 사이트에 들어갈때, 로그인을 해야만 들어갈 수 있게 한다. localStorage에 로그인 정보가 없으면, login페이지로 넘어가도록 한다. 문제상황 처음에 myAdmin.com/ 요기가 Admin page, myAdmin.com/login 요기가 login page다. /로 들어왔을때 로그인 정보가 없으면 /login으로 redirect 시켰다. 그런데 다음과 같은 에러가 나왔다. Uncaught Error: Maximum update depth exceeded. This can happen when a component repeatedly calls setState inside componentWillUpdate or...

JSX element type ‘Component’ does not have any construct or call signatures.

J

문제상황 export namespace VC { ... export interface AuthRouteProps extends RouteProps { authenticated: boolean } ... } import React, { FC, ReactElement } from "react"; import { Route, Redirect } from "react-router-dom"; import { VC } from "../../types"; const AuthRoute: FC<VC.AuthRouteProps> = ({ authenticated, render, component: Component, ...rest }): ReactElement => { return ( <Route {...