Npm install error

[superbderrick]

안녕하세요. Zoomcoding님,

좋은 Gatsby-theme를 만들어주셔서 감사합니다.

제블로그도 만들어주신 Theme를 사용하려고 업데이트중에 있는데요.

Npm start 과정중에 error가 발생해 문의 드립니다.

이슈 재현방법은

프로젝트 clone후에 $ sudo npm install 진행하였고, npm start 동작중에 아래와 같이 문제가 발생합니다

제 개발 PC의 OS는 Mac OS catalina 10.15.6 version입니다.

> derrick@derricks-MacBook-Pro-2 zoomkoding-gatsby-blog % npm start

> zoomkoding.com@1.1.0 start
> npm run develop


> zoomkoding.com@1.1.0 develop
> gatsby develop


Something is already running at port 8000

✔ Would you like to run the app at another port instead? … yes

success open and validate gatsby-configs - 0.091s
warn Plugin gatsby-remark-images is not compatible with your gatsby version 2.32.13 - It requires gatsby@^3.0.0-next.0
warn Plugin gatsby-remark-prismjs is not compatible with your gatsby version 2.32.13 - It requires gatsby@^3.0.0-next.0
warn Plugin gatsby-remark-copy-linked-files is not compatible with your gatsby version 2.32.13 - It requires
gatsby@^3.0.0-next.0
warn Plugin gatsby-remark-smartypants is not compatible with your gatsby version 2.32.13 - It requires
gatsby@^3.0.0-next.0

ERROR 

Error in "/Users/derrick/blog/maruta/zoomkoding-gatsby-blog/gatsby-node.js": Unexpected token '.'



**Error: /Users/derrick/blog/maruta/zoomkoding-gatsby-blog/gatsby-node.js:40
        nextSlug: next?.fields.slug ?? '',**
                       ^
SyntaxError: Unexpected token '.'

- v8-compile-cache.js:240 NativeCompileCache._moduleCompile
  [zoomkoding-gatsby-blog]/[v8-compile-cache]/v8-compile-cache.js:240:18

- v8-compile-cache.js:184 Module._compile
  [zoomkoding-gatsby-blog]/[v8-compile-cache]/v8-compile-cache.js:184:36

- loader.js:1153 Object.Module._extensions..js
  internal/modules/cjs/loader.js:1153:10

- loader.js:977 Module.load
  internal/modules/cjs/loader.js:977:32

- loader.js:877 Function.Module._load
  internal/modules/cjs/loader.js:877:14

- loader.js:1019 Module.require
  internal/modules/cjs/loader.js:1019:19

- v8-compile-cache.js:159 require
  [zoomkoding-gatsby-blog]/[v8-compile-cache]/v8-compile-cache.js:159:20

- resolve-module-exports.ts:197 resolveModuleExports
  [zoomkoding-gatsby-blog]/[gatsby]/src/bootstrap/resolve-module-exports.ts:197:26

- validate.ts:348 forEach
  [zoomkoding-gatsby-blog]/[gatsby]/src/bootstrap/load-plugins/validate.ts:348:31

- Array.forEach

- validate.ts:340 collatePluginAPIs
  [zoomkoding-gatsby-blog]/[gatsby]/src/bootstrap/load-plugins/validate.ts:340:20

- index.ts:107 loadPlugins
  [zoomkoding-gatsby-blog]/[gatsby]/src/bootstrap/load-plugins/index.ts:107:13

- initialize.ts:284 initialize
  [zoomkoding-gatsby-blog]/[gatsby]/src/services/initialize.ts:284:28


not finished load plugins - 1.392s

npm ERR! code 1
npm ERR! path /Users/derrick/blog/maruta/zoomkoding-gatsby-blog
npm ERR! command failed
npm ERR! command sh -c gatsby develop

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/derrick/.npm/_logs/2021-07-20T13_26_09_814Z-debug.log
derrick@derricks-MacBook-Pro-2 zoomkoding-gatsby-blog % 
derrick@derricks-MacBook-Pro-2 zoomkoding-gatsby-blog % 

Error: /Users/derrick/blog/maruta/zoomkoding-gatsby-blog/gatsby-node.js:40
nextSlug: next?.fields.slug ?? '',

`

const createBlogPages = ({ createPage, results }) => {
  const blogPostTemplate = require.resolve(`./src/templates/blog-template.js`);
  results.data.allMarkdownRemark.edges.forEach(({ node, next, previous }) => {
    createPage({
      path: node.fields.slug,
      component: blogPostTemplate,
      context: {
        // additional data can be passed via context
        slug: node.fields.slug,
        nextSlug: next?.fields.slug ?? '',
        prevSlug: previous?.fields.slug ?? '',
      },
    });
  });
};`

문제가 발생하는 라인에가서, slug,nextSlug,prevSlug 모두 test값으로 test string값을 넣고,

npm start 하니 정상적으로 잘되더라고요

npm install과정중에 라이브러리들이 audit alert 부분이 뜨긴했는데,

> 
65 packages are looking for funding
  run `npm fund` for details

32 vulnerabilities (16 moderate, 16 high)

To address issues that do not require attention, run:
  npm audit fix

To address all issues possible (including breaking changes), run:
  npm audit fix --force

Some issues need review, and may require choosing
a different dependency.

Run `npm audit` for details.

혹시 제가 빠뜨린 부분이 있을까요?
감사합니다

[zoomkoding]

안녕하세요, @superbderrick님!
제 테마에 관심 가져주셔서 감사합니다!
현재 node 버전이 어떻게 되시나요?

node -v

[superbderrick]

안녕하세요, @zoomkoding
확인해보니, Node가 12.대 사용중이었어요! , node 최신버전으로 업데이트하고 해보니 잘되네요 감사합니다 :)

[zoomkoding]

노드 버전 업그레이드 방법은 이 글을 참고하시면 좋을 것 같습니다!
방법이 길지 않아 바로 소개해드리면

Ubuntu Linux/Mac: 다음 명령어 실행하기

sudo npm install n -g
sudo n stable

Window: 홈페이지에서 재설치