인프런 커뮤니티 질문&답변
작성한 질문수
vite 명령어로 프로젝트를 만들었습니다. (vscode)
작성
·
79
·
수정됨
0
vite 명령어로 프로젝트 생성
끝 (확장 프로그램 미설치)
-- App.jsx --
위 화면 같이
붉은 라인이 생기는 이유가 무었인가요?
(참고로 vscode 자동생성 기능을 off 로 설정해서 사용중)
갑자기 위와 같은 화면이 나와
전에 생성한 프로젝트를 열어 보왔는데요
멀쩡히 (붉은 색 라인 없음) 잘 나오던 파일이
위와 같은 증상이 똑같이 나오고 있습니다.
코파일럿, 구글링이 알려준 데로 처리 했는데
같은 증상이 나오고 있습니다.
원인이 무엇인지 질문드립니다.
(아~ "npm run dev" : 정상 동작합니다.)
Plz....
프로젝트 생성시 TypeSCript로 생성하지 않고
일반 jsscript로 설정했습니다.
ts파일 머시지 어쩌구 하는데.. 에공..
<div> 마우스 오버시 위 메지내 내용 화면>
※ vscode 에서 자동 생성을 막으려고 제가 무슨 짓을 했는지... (머 이것 저것 ctrl + shift + p로 ..내용을 찾아 뭔짓을 했는지... (json 파일) 그때 부터인듯 싶습니다.
※ vscode 재설치 : 같은 증상
질문 내용이 vscode에 관한 내용인듯 한데
소스 내용이 아닌 질문이라..죄송합니다.
!!! 아무래도 vscode typescript 버전인듯 싶습니다.
근데 전 ctrl + , 를 눌러서 typescript 를 눌러서 검색해 보면
아 놔~~ 구글링에서 설명한 화면이랑 다르네요..
하~~ 오전 부터 이게 왠 ... 우쒸~~
퀴즈
Client-Side Rendering(CSR)은 무엇을 의미할까요?
서버에서 페이지의 모든 내용을 미리 만들어 브라우저에 전달하는 방식
브라우저(클라이언트)에서 JavaScript를 사용하여 페이지 내용을 동적으로 생성하는 방식
서버와 클라이언트가 협력하여 페이지 일부를 번갈아 렌더링하는 방식
별도의 HTML 문서 없이 서버 API 호출만으로 화면을 구성하는 방식
답변 1
0
안녕하세요! 🙂
npm run dev가 정상 동작한다면 코드 자체에는 문제가 없어요! 이건 VS Code의 에디터 설정 문제인데요~!
에러 메시지를 보면 TypeScript 에러 코드가 보이는데요. VS Code가 JavaScript(.jsx) 파일을 TypeScript로 검사하고 있어서 JSX 문법(<div> 등)을 에러로 인식하는 거 같은데.
설정을 건드렸다고 하셨는데, 그 과정에서 설정이 꼬였을 가능성이 있고
방법 (순서대로 시도해보세요)
1. jsconfig.json 파일 생성 (가장 권장) 프로젝트 루트 폴더에 jsconfig.json 파일을 만들고 아래 내용을 넣어주세요:
{
"compilerOptions": {
"jsx": "react-jsx",
"target": "ES2020",
"module": "ESNext",
"moduleResolution": "bundler"
},
"include": ["src"]
}
2. VS Code 사용자 설정 초기화Ctrl + Shift + P → "Preferences: Open User Settings (JSON)" → 이전에 추가했던 TypeScript/JavaScript 관련 설정들 삭제
3. VS Code 완전히 재시작 설정 변경 후 VS Code를 완전히 종료했다가 다시 열기
1번 방법으로 대부분 해결되니 먼저 시도해보세요!
감사합니다 🙏
설명해주신 답변 .. 여기다 작성하는 것인지요?
뭐 ~ 항상 친절히 설명 해주시는 짐코딩님......... ^^
세삼스럽게... 감사는 무슨...ㅎㅎㅎ ... 생략하겠습니다. 풉~~~ (농담)
★ 친절한 설명 정말 감사드립니다.~~~!! ★
※ 아~ 강의 버전 확인 하러 갑니다.
(tailwind .. v3..., v4.1 ... . 하..아주 진짜. 버전스트레스... .. . )