시작부터 안됩니다.
481
작성한 질문수 105
codepen.io에서 Add External Scripts/Pens 에서
react로 검색해서 https://cdnjs.cloudflare.com/ajax/libs/react/18.3.1/cjs/react.production.min.js
이거랑 https://cdnjs.cloudflare.com/ajax/libs/react-dom/18.3.1/cjs/react-dom.production.min.js
이렇게 두가지가 나오고 save and close도 아니고 close만 있구요 close만 해도 상태는 유 지되는건지 모르겠네요 ..그래서인지 몰라도 코드넣고 실행해보면 에러납니다.
class CodeLab extends React.Component {
render() {
return (
<div>CodeLab</div>
);
}
}
class App extends React.Component {
render() {
return (
<CodeLab />
);
}
}
ReactDOM.render(<App />, document.getElementById('root'))
Uncaught ReferenceError: React is not defined 에러나고 그래서 강좌에 없는
import React from 'react' 넣고 나면
Uncaught ReferenceError: require is not defined 이 에러가 납니다. 도무지 진행이 안되네요 ㅠ
Uncaught ReferenceError: React is not defined
Uncaught ReferenceError: React is not defined
답변 2
0
코드펜이 제공하는 cdn이 버전이 너무 최신이라서 그런 오류가 나는 것 같더라고요!
여기 들어가셔서 react 랑 react-dom cdn 링크 복사한 다음에 setting>js>Add External Scripts/Pens 에 복붙하면 됩니다!
정리하자면
https://unpkg.com/react@18/umd/react.development.jshttps://unpkg.com/react-dom@18/umd/react-dom.development.js이거 두 개 setting>js>Add External Scripts/Pens 여기에 붙여 넣어 주세요
0
안녕하세요, 인프런 AI 인턴입니다.
odark님의 문제를 해결하기 위해 몇 가지 제안드립니다.
먼저, CodePen에서 외부 스크립트를 추가한 후에는 CodePen이 자동으로 React와 ReactDOM을 전역 변수로 설정합니다. 그럼에도 불구하고 “React is not defined” 오류가 발생한다면, 스크립트가 제대로 로드되지 않았을 가능성이 높습니다.
- CodePen 설정에서 React와 ReactDOM의 URL이 정확한지 다시 확인해 주세요.
- CodePen이 제공하는 React 템플릿을 사용할 수 있습니다. CodePen 홈페이지에서 ‘Templates’를 검색하여 ‘React’ 템플릿을 찾아 사용할 수 있습니다. 이 방법을 사용하면 직접 URL을 추가할 필요가 없습니다.
import React from 'react'와 같은 모듈 import 구문은 CodePen과 같은 브라우저 환경에서는 작동하지 않습니다. 이 구문들은 보통 Create React App과 같은 개발 환경에서 사용됩니다. 따라서 이러한 코드는 CodePen에서 제거해야 합니다.
문제가 지속될 경우, CodePen이 아닌 로컬 개발 환경에서 Create React App을 이용하여 React 프로젝트를 시작하는 것을 고려해 보시는 것도 좋은 방법입니다. Create React App은 모듈 시스템을 올바르게 설정하고 관리해줍니다.
참고로, CodePen에서 일반적으로 React 코드를 실행하기 위해서는 React와 ReactDOM 링크를 추가한 뒤 직접 React 코드를 작성하기만 하면 됩니다. “require”나 “import” 같은 Node.js의 모듈 시스템은 CodePen에서 지원하지 않습니다.
도움이 되었길 바라며, 추가 질문이 있으시다면 또 문의주세요.
잘 배우고있었는데 ㅠㅠ
0
292
1
react hot reloader
0
191
1
this.props.name할때
0
173
1
초급 유료버전과 차이점은 무엇인가요?
0
337
1
localStorage 강좌에서 componentwillmount 관련 질문입니다.
0
360
1
아무것도 뜨지 않아요
0
567
4
아래 화면에 선생님처럼 Codelab이 안뜹니다. 수업진행이 안되네요
0
510
2
쌤 리액트로 앱 만들수 있는건가요?
0
325
0
babel-preset-stage-0 패키지를 인스톨하여 presets에 stage-0 을 넣자 에러가 발생합니다.
0
312
1
rcc 스니펫 안되시는분들
0
270
0
webpack 5 대응
10
445
2
props의 정의에 대한 질문입니다.
0
377
1
section 4까지 수강 후 프로젝트 완성 후 오류 질문
0
373
1
react.min.js:13 Uncaught TypeError: e.render is not a function
0
345
0
화면에 나오는 코드로 하면 propTypes가 먹히지 않습니다.
0
424
2
메모앱 프로젝트 질문있습니다.
0
229
0
codepen.io 에 퀵에드가 없는데요ㅜㅜ
0
311
1
App.js에서 html 빨간줄
0
288
0
리뉴얼 강좌관련 질문드립니다.
0
260
0
App.js에서 오류가 나네요..
0
258
0
react app과의 port 혼용
1
274
0
Atom으로 예제를 따라하고 있는데 브라우저에 아무것도 나오질 않습니다.
0
335
2
여러개의 smart 컴포넌트를 만들어서 connect할 수 있는건가요?
0
252
0
React-hot-loader 가 제대로 동작하지 않아요..
0
465
1