강의

멘토링

커뮤니티

인프런 커뮤니티 질문&답변

허성진님의 프로필 이미지
허성진

작성한 질문수

[리뉴얼] React로 NodeBird SNS 만들기

프론트 서버 배포하기

sudo npx pm2 start npm -- start && sudo npx pm2 monit 사용후 에러입니다

작성

·

400

0

포트도 맞게 작성한거 같은데 오류가 뜹니다 

찾아보니 80포트에 권한이 없다고 나오는데 해결방법을 적용해도 해결이 되지않아 질문을 남깁니다

{
"name": "react-nodebird-front",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"dev": "next -p 3060",
"build": "ANALYZE=true NODE_ENV=production next build",
"start": "NODE_ENV=production next start -p 80"
},
"author": "HoneyKikiki",
"license": "ISC",
"dependencies": {
"@ant-design/icons": "^4.6.3",
"@next/bundle-analyzer": "^11.1.2",
"antd": "^4.16.12",
"axios": "^0.21.1",
"babel-plugin-styled-components": "^1.13.2",
"cross-env": "^7.0.3",
"faker": "^5.5.3",
"i": "^0.3.6",
"immer": "^9.0.5",
"moment": "^2.29.1",
"next": "^9.5.5",
"next-redux-wrapper": "^7.0.2",
"npm": "^7.23.0",
"pm2": "^5.1.1",
"prop-types": "^15.7.2",
"react": "^16.14.0",
"react-dom": "^16.14.0",
"react-redux": "^7.2.4",
"react-slick": "^0.28.1",
"redux": "^4.1.1",
"redux-devtools-extension": "^2.13.9",
"redux-saga": "^1.1.3",
"shortid": "^2.2.16",
"styled-components": "^5.3.0",
"swr": "^1.0.0",
"webpack": "4.44.1"
},
"devDependencies": {
"babel-eslint": "^10.1.0",
"eslint": "^7.32.0",
"eslint-config-airbnb": "^18.2.1",
"eslint-config-prettier": "^8.3.0",
"eslint-plugin-import": "^2.24.2",
"eslint-plugin-jsx-a11y": "^6.4.1",
"eslint-plugin-prettier": "^3.4.1",
"eslint-plugin-react": "^7.24.0",
"eslint-plugin-react-hooks": "^4.2.0"
}
}

답변 1

0

제로초(조현영)님의 프로필 이미지
제로초(조현영)
지식공유자

다음과 같이 수정한 후에 다시 실행해보세요.

"start": "sudo NODE_ENV=production next start -p 80"

허성진님의 프로필 이미지
허성진
질문자

바꾸고 커밋하고 해도 되지않네요 ...

다른곳에서 잘못된걸까요?

{
"name": "react-nodebird-front",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"dev": "next -p 3060",
"build": "ANALYZE=true NODE_ENV=production next build",
"start": "sudo NODE_ENV=production next start -p 80"
},
"author": "HoneyKikiki",
"license": "ISC",
"dependencies": {
"@ant-design/icons": "^4.6.3",
"@next/bundle-analyzer": "^11.1.2",
"antd": "^4.16.12",
"axios": "^0.21.1",
"babel-plugin-styled-components": "^1.13.2",
"cross-env": "^7.0.3",
"faker": "^5.5.3",
"i": "^0.3.6",
"immer": "^9.0.5",
"moment": "^2.29.1",
"next": "^9.5.5",
"next-redux-wrapper": "^7.0.2",
"npm": "^7.23.0",
"pm2": "^5.1.1",
"prop-types": "^15.7.2",
"react": "^16.14.0",
"react-dom": "^16.14.0",
"react-redux": "^7.2.4",
"react-slick": "^0.28.1",
"redux": "^4.1.1",
"redux-devtools-extension": "^2.13.9",
"redux-saga": "^1.1.3",
"shortid": "^2.2.16",
"styled-components": "^5.3.0",
"swr": "^1.0.0",
"webpack": "4.44.1"
},
"devDependencies": {
"babel-eslint": "^10.1.0",
"eslint": "^7.32.0",
"eslint-config-airbnb": "^18.2.1",
"eslint-config-prettier": "^8.3.0",
"eslint-plugin-import": "^2.24.2",
"eslint-plugin-jsx-a11y": "^6.4.1",
"eslint-plugin-prettier": "^3.4.1",
"eslint-plugin-react": "^7.24.0",
"eslint-plugin-react-hooks": "^4.2.0"
}
}
허성진님의 프로필 이미지
허성진
질문자

sudo npm start 하면 이러한 오류가 뜹니다

제로초(조현영)님의 프로필 이미지
제로초(조현영)
지식공유자

npm i 하셨나요?

허성진님의 프로필 이미지
허성진
질문자

npm i 해도 안됩니다 ....

 

> ANALYZE=true NODE_ENV=production next build

 

info  - Using webpack 5. Reason: Enabled by default https://nextjs.org/docs/messages/webpack5

info  - Checking validity of types  

error - ESLint: .eslintrc:      Configuration for rule "eslint-disable-next-line" is invalid:   Severity should be one of the following: 0 = off, 1 = warn, 2 = error (you passed '"eslint-disable"'). 

Webpack Bundle Analyzer saved report to /home/ubuntu/react-nodeBird/prepare/front/.next/analyze/client.html

Webpack Bundle Analyzer saved report to /home/ubuntu/react-nodeBird/prepare/front/.next/server/analyze/server.html

info  - Creating an optimized production build  

info  - Compiled successfully

info  - Collecting page data  

info  - Generating static pages (2/2)

info  - Finalizing page optimization  

 

Page                              Size     First Load JS

┌ λ /                             1.34 kB         258 kB

├   /_app                         0 B              89 kB

├ ○ /404                          194 B          89.2 kB

├ λ /hashtag/[tag]                539 B           257 kB

├ λ /post/[id]                    561 B           257 kB

├ λ /profile                      6.61 kB         225 kB

├ λ /signup                       4.53 kB         196 kB

└ λ /user/[id]                    959 B           257 kB

+ First Load JS shared by all     89 kB

  ├ chunks/framework.7ed9e7.js    40.7 kB

  ├ chunks/main.8d1561.js         23.3 kB

  ├ chunks/pages/_app.cfb539.js   24.1 kB

  ├ chunks/webpack.613fd8.js      886 B

  └ css/d81de07a0eb0cb17599d.css  67.8 kB

 

λ  (Server)  server-side renders at runtime (uses getInitialProps or getServerSideProps)

○  (Static)  automatically rendered as static HTML (uses no initial props)

●  (SSG)     automatically generated as static HTML + JSON (uses getStaticProps)

   (ISR)     incremental static regeneration (uses revalidate in getStaticProps)

 

 

ubuntu@ip-172-31-45-172:~/react-nodeBird/prepare/front$ 

제로초(조현영)님의 프로필 이미지
제로초(조현영)
지식공유자

error - ESLint: .eslintrc:      Configuration for rule "eslint-disable-next-line" is invalid:   Severity should be one of the following: 0 = off, 1 = warn, 2 = error (you passed '"eslint-disable"'). 

이거부터 해결하세요. eslint-disable 자리에 off를 넣으세요.

제로초(조현영)님의 프로필 이미지
제로초(조현영)
지식공유자

그리고 next라는 커맨드가 없다 나오면 next 커맨드가 설치가 안 된 겁니다. npm i -g next 하세요.

제로초(조현영)님의 프로필 이미지
제로초(조현영)
지식공유자

sudo npx pm2 logs --err --lines 100 해서 서버 에러 확인하시고요.

sudo npx pm2 list 했을 때 새로고침 횟수가 0이 아니면 서버에 에러가 있어서 죽었다가 pm2가 계속 다시 살리는 겁니다. 에러를 확인해야 합니다.

허성진님의 프로필 이미지
허성진
질문자

npm i -g next 를 해도 sudo:next: command not found 로 뜨고있습니다

허성진님의 프로필 이미지
허성진
질문자

이거부터 해결하세요. eslint-disable 자리에 off를 넣으세요.  <= 이거를 해결하니까 이렇게 오류가 뜨는데 방법을 찾는데 해결이 되지않습니다 차라리 다시 처음부터 만드는 방법이 좋을까요?
 
npm i -g next 도 했습니다

제로초(조현영)님의 프로필 이미지
제로초(조현영)
지식공유자

지금 발생하는 모든 에러가 npm i를 하지 않아서 발생하는 에러입니다. npm i를 했다면 강좌와 버전이 달라서 발생하는 문제입니다. cannot find module prettier나 next: command not found 모두요. 로컬에서는 됐는데 서버에서만 안 되는 거라면 저도 의문입니다.

명령어에 sudo는 다시 빼세요. 다시 처음 에러로 돌아가서 80번 포트 쓰는 것에서 문제였다면 80번 포트를 안 쓰면 됩니다. nginx 강좌 따라서 nginx 설정하면 해결됩니다.

허성진님의 프로필 이미지
허성진
질문자

여러가지 찾아보면서 시도해본다고 오류가 더 커진것같습니다. 
npm install --save --legacy-peer-deps  이용해서 다시 처음 오류도 돌아갔습니다

제로초(조현영)님의 프로필 이미지
제로초(조현영)
지식공유자

네 뒤에 나오는 nginx 강좌 보시면 80번포트에 nginx를, next를 3060번 포트를 써서 연결하게 됩니다.

허성진님의 프로필 이미지
허성진

작성한 질문수

질문하기