Failed to Compile

[윤형진]

 

리액트 개발환경 셋팅하고 폴더 째로 오픈 후

뉴터미널 npm start 로 미리보기 띄우면 localhost:3000 미리보기는 뜨는데 뜨고난 뒤에 터미널에 Failed to Compile 오류메시지가 뜹니다. 아예 처음이다 보니 어디서 잘못된 건지를 모르는 게 참 답답하네요.

[codingapple]

설치가 끝까지 제대로 안되었거나 터미널 실행중인게 몇개 더 있거나 그런가봅니다 

에디터 껐다가 다시켜보거나 

프로젝트 지우고 다시만들어보면 됩니다 

[윤형진]

nodejs 제어판에서 제거하고 프로젝트도 다 지우고 다시 npx create-react-app 해서 만들어도 npm start 하면 똑같은 Failed to Compile 오류 납니다.

Module not found: Error: Can't resolve 'C:\#Coding\react\blog\node_modules\webpack-dev-server\client\index.js?protocol=ws%3A&hostname=0.0.0.0&port=3000&pathname=%2Fws&logging=none&reconnect=10' in 'C:\#Coding\react\blog'

 

저쪽 경로에 있는 index.js 에서 Module 을 못 찾는 오류같은데 저게 무슨 오륜지를 모르겠네요.

webpack compiled with 1 error

에러는 하나인거같은데...

[codingapple]

에디터 터미널에서 실행중인거 다 끄고 에디터 터미널열어서 npm fix audit --force 해보거나 

아니면 node modules 폴더 삭제하고 에디터 터미널에서 npm install 눌러봅시다

안되면 package.json 코드를 복붙해주십시오 

 

[윤형진]

말씀주신 방법 2가지 다 시도해봤는데 여전히 컴파일 에러납니다.

아래는 package.json 코드입니다.

 

{
  "name": "blog",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@testing-library/jest-dom": "^5.16.4",
    "@testing-library/react": "^13.2.0",
    "@testing-library/user-event": "^13.5.0",
    "react": "^18.1.0",
    "react-dom": "^18.1.0",
    "react-scripts": "5.0.1",
    "web-vitals": "^2.1.4"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": [
      "react-app",
      "react-app/jest"
    ]
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}

 

[codingapple]

작업폴더를 혹시 이상한 구글드라이브나 원드라이브 안에 만드셨나요 

[윤형진]

C드라이브에 만들었습니다.

혹시 폴더명에 # 때문에 오류가 날 수도 있나요? 

구글드라이브(Google Drive for Desktop)가 깔려있긴 합니다.

[codingapple]

바탕화면이나 다른 폴더에 만들어봅시다 

[윤형진]

그래도 안됩니다...

[codingapple]

nodejs 16버전 설치한거 맞겠죠?

터미널에서 npm install webpack-dev-server 하거나

아니면 설치강의에 있는 첨부파일 다운받아서

에디터에서 폴더열고 터미널열어서 npm install 한 뒤에 사용하면 됩니다 

[글쓴이]

글