> 30 | header: propTypes.String.isRequired,
579
작성한 질문수 29
http://localhost:3000/profile 누르면 나오는 문구
1 of 1 unhandled error
Server Error
ReferenceError: propTypes is not defined
This error happened while generating the page. Any console logs will be displayed in the terminal window.
Source
components\FollowList.js (30:12) @ propTypes
28 |
29 | FollowList.propTypes ={
> 30 | header: propTypes.String.isRequired,
| ^
31 | data: propTypes.arry.isRequired,
32 | };
33 |
vscode터미널 상황
error - components\FollowList.js (30:12) @ propTypes
error - ReferenceError: propTypes is not defined
at eval (webpack-internal:///./components/FollowList.js:65:13)
at Object../components/FollowList.js (D:\react-zero\front\.next\server\pages\profile.js:88:1)
at __webpack_require__ (D:\react-zero\front\.next\server\webpack-runtime.js:33:42)
at eval (webpack-internal:///./pages/profile.js:13:80)
at Object../pages/profile.js (D:\react-zero\front\.next\server\pages\profile.js:308:1)
PS D:\react-zero\front> npm run dev
npm WARN cli npm v9.1.3 does not support Node.js v16.0.0. You should probably upgrade to a
npm WARN cli newer version of node as we can't make any promises that npm will work with this
npm WARN cli version. This version of npm supports the following node versions: `^14.17.0 ||
npm WARN cli ^16.13.0 || >=18.0.0`. You can find the latest version at https://nodejs.org/.
> react-zero@1.0.0 dev
> next
ready - started server on 0.0.0.0:3000, url: http://localhost:3000
event - compiled client and server successfully in 825 ms (171 modules)
wait - compiling / (client and server)...
event - compiled client and server successfully in 1077 ms (1210 modules)
Warning: [antd: Menu] `children` will be removed in next major version. Please use `items` instead.
Warning: MenuItem should not leave undefined `key`.
wait - compiling /_error (client and server)...
event - compiled client and server successfully in 410 ms (1211 modules)
warn - Fast Refresh had to perform a full reload due to a runtime error.
wait - compiling /profile (client and server)...
event - compiled client and server successfully in 889 ms (2691 modules)
error - components\FollowList.js (30:12) @ propTypes
error - ReferenceError: propTypes is not defined
at eval (webpack-internal:///./components/FollowList.js:65:13)
at Object../components/FollowList.js (D:\react-zero\front\.next\server\pages\profile.js:88:1)
at __webpack_require__ (D:\react-zero\front\.next\server\webpack-runtime.js:33:42)
at eval (webpack-internal:///./pages/profile.js:13:80)
at Object../pages/profile.js (D:\react-zero\front\.next\server\pages\profile.js:308:1)
at __webpack_require__ (D:\react-zero\front\.next\server\webpack-runtime.js:33:42)
at __webpack_exec__ (D:\react-zero\front\.next\server\pages\profile.js:702:39)
at D:\react-zero\front\.next\server\pages\profile.js:703:28
at Object.<anonymous> (D:\react-zero\front\.next\server\pages\profile.js:706:3)
at Module._compile (node:internal/modules/cjs/loader:1108:14) {
page: '/profile'
}
28 |
29 | FollowList.propTypes ={
> 30 | header: propTypes.String.isRequired,
| ^
31 | data: propTypes.arry.isRequired,
32 | };
33 |
profile.js
import Head from 'next/head';
import React from 'react';
import AppLayout from '../components/AppLayout';
import NicknameEditForm from '../components/NicknameEdit';
import FollowList from '../components/FollowList';
const Profile = () => {
const followerList = [{nickname: '제로초'}, { nickname: '바보'}, {nickname: '노드버드오피셜'} ];
const followingList = [{nickname: '제로초'}, { nickname: '바보'}, {nickname: '노드버드오피셜'} ];
return (
<>
<Head>
<title>프로필 | NodeBrid</title>
</Head>
<AppLayout>
내 프로필
<NicknameEditForm/>
<FollowList header="팔로잉 목록" data={follwingList}/>
<FollowList header="팔로워 목록" data={follwerList}/>
</AppLayout>
</>
);
};
export default Profile;
follwerlist.js
import React from 'react';
import {Button, Card, List} from 'antd';
import PropTypes from 'prop-types';
import { StopOutlined } from '@ant-design/icons';
const FollowList = ({ header, data }) =>{
return(
<List
style={{ marginBottom:20}}
grid={{ gutter:4, xs: 2, md: 3}}
size="small"
header={<div>{header}</div>}
loadMore={<div style={ {textAlign: 'center', margin: '10px 0' } }><Button>더 보기</Button></div>}
bordered
dataSource={data}
renderItem={(item) => (
<List.Item style={ {marginTop: 20} }>
<Card actions= {[<StopOutlined key='stop'/>]}>
<Card.Meta description={item.nickname} />
</Card>
</List.Item>
)}
/>
);
};
FollowList.propTypes ={
header: propTypes.String.isRequired,
data: propTypes.arry.isRequired,
};
export default FollowList;
무엇이 잘된것일까요 ㅠㅠ
지금 하나하나씩 다 쳐보면서 따라가고잇습니다.
제가 새로운 인강버그를 발견할지는 모릅니다.!
!
ㅇ
답변 2
넥스트 버젼 질문
0
79
2
로그인시 401 Unauthorized 오류가 뜹니다
0
91
1
무한 스크롤 중 스크롤 튐 현상
0
178
1
특정 페이지 접근을 막고 싶을 때
0
105
2
createGlobalStyle의 위치와 영향범위
0
97
2
인라인 스타일 리렌더링 관련
0
93
2
vsc 에서 npm init 설치시 오류
0
149
2
nextjs 15버전 사용 가능할까요?
0
160
1
화면 새로고침 문의
0
124
1
RTK에서 draft, state 차이가 있나요?
0
156
2
Next 14 사용해도 될까요?
0
454
1
next, node 버전 / 폴더 구조 질문 드립니다.
0
350
1
url 오류 질문있습니다
0
212
1
ssh xxxxx로 우분투에 들어가려니까 port 22: Connection timed out
0
381
1
sudo certbot --nginx 에러
0
1282
2
Minified React error 콘솔에러 (hydrate)
0
472
1
카카오 공유했을 때 이전에 작성했던 글이 나오는 버그
0
249
1
프론트서버 배포 후 EADDRINUSE에러 발생
0
330
1
npm run build 에러
0
519
1
front 서버 npm run build 중에 발생한 에러들
0
384
1
서버 실행하고 브라우저로 들어갔을때 404에러
0
339
2
css 서버사이드 랜더링이 적용되지 않아서 문의 드립니다.
0
289
1
팔로워 3명씩 불러오고 데이터 합쳐주는걸로 바꾸고 서버요청을 무한으로하고있습니다.
0
243
2
해시태그 검색에서 throttle에 관해 질문있습니다.
0
203
1