Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Unable to build lesson 14 (exercise 13) in the course #5

Open
JESii opened this issue Oct 29, 2022 · 4 comments
Open

Unable to build lesson 14 (exercise 13) in the course #5

JESii opened this issue Oct 29, 2022 · 4 comments

Comments

@JESii
Copy link

JESii commented Oct 29, 2022

When I attempt to build exercise 13, it throws an error about a problem in exercise 7 -- even though I completed that exercise successfully some time ago

npm run build

jseidel@edp34:[exercise-13--use-the-server-side-rendering-method->]~/dev/egghead-beginners-guide-nextjs/exercises/exercise-13--use-the-server-side-rendering-method$ npm run build

> exercise-13@1.0.0 build /Users/jseidel/dev/egghead-beginners-guide-nextjs/exercises/exercise-13--use-the-server-side-rendering-method
> next build

Browserslist: caniuse-lite is outdated. Please run:
  npx browserslist@latest --update-db
  Why you should do it regularly: https://github.com/browserslist/browserslist#browsers-data-updating
Failed to compile.

../exercise-07--override-the-app-component/pages/_app.tsx:4:11. // <===== Exercise 7?
Type error: 'Component' cannot be used as a JSX component.
  Its element type 'ReactElement<any, any> | Component<{}, any, any> | null' is not a valid JSX element.

  2 |
  3 | const App = ({ Component, pageProps }: AppProps) => {
> 4 |   return <Component {...pageProps} title="My Crazy Title" />
    |           ^
  5 | }
  6 |
  7 | export default App
info  - Checking validity of types .npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! exercise-13@1.0.0 build: `next build`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the exercise-13@1.0.0 build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/jseidel/.npm/_logs/2022-10-29T12_59_25_123Z-debug.log

Debug log

0 info it worked if it ends with ok
1 verbose cli [
1 verbose cli   '/Users/jseidel/.nvm/versions/node/v14.17.0/bin/node',
1 verbose cli   '/Users/jseidel/.nvm/versions/node/v14.17.0/bin/npm',
1 verbose cli   'run',
1 verbose cli   'build'
1 verbose cli ]
2 info using npm@6.14.13
3 info using node@v14.17.0
4 verbose run-script [ 'prebuild', 'build', 'postbuild' ]
5 info lifecycle exercise-13@1.0.0~prebuild: exercise-13@1.0.0
6 info lifecycle exercise-13@1.0.0~build: exercise-13@1.0.0
7 verbose lifecycle exercise-13@1.0.0~build: unsafe-perm in lifecycle true
8 verbose lifecycle exercise-13@1.0.0~build: PATH: /Users/jseidel/.nvm/versions/node/v14.17.0/lib/node_modules/npm/node_modules/npm-lifecycle/node-gyp-bin:/Users/jseidel/dev/egghead-beginners-guide-nextjs/exercises/exercise-13--use-the-server-side-rendering-method/node_modules/.bin:/Users/jseidel/.rvm/gems/ruby-2.7.6/bin:/Users/jseidel/.rvm/gems/ruby-2.7.6@global/bin:/Users/jseidel/.rvm/rubies/ruby-2.7.6/bin:/Users/jseidel/.rvm/bin:/Users/jseidel/.nvm/versions/node/v14.17.0/bin:~/.dotfiles/bin:/usr/local/sbin:/usr/local/bin:/usr/bin:/bin:/usr/sbin:/sbin:/Library/Apple/usr/bin::/usr/local/opt/android-sdk/tools:/usr/local/opt/android-sdk/platform-tools:/Users/jseidel/bin:/Users/jseidel/perl5/bin:/usr/local/mysql/bin:/Users/jseidel/dev/Mongodb/bin:/usr/local/heroku/bin:/usr/local/go/bin
9 verbose lifecycle exercise-13@1.0.0~build: CWD: /Users/jseidel/dev/egghead-beginners-guide-nextjs/exercises/exercise-13--use-the-server-side-rendering-method
10 silly lifecycle exercise-13@1.0.0~build: Args: [ '-c', 'next build' ]
11 silly lifecycle exercise-13@1.0.0~build: Returned: code: 1  signal: null
12 info lifecycle exercise-13@1.0.0~build: Failed to exec build script
13 verbose stack Error: exercise-13@1.0.0 build: `next build`
13 verbose stack Exit status 1
13 verbose stack     at EventEmitter.<anonymous> (/Users/jseidel/.nvm/versions/node/v14.17.0/lib/node_modules/npm/node_modules/npm-lifecycle/index.js:332:16)
13 verbose stack     at EventEmitter.emit (events.js:376:20)
13 verbose stack     at ChildProcess.<anonymous> (/Users/jseidel/.nvm/versions/node/v14.17.0/lib/node_modules/npm/node_modules/npm-lifecycle/lib/spawn.js:55:14)
13 verbose stack     at ChildProcess.emit (events.js:376:20)
13 verbose stack     at maybeClose (internal/child_process.js:1055:16)
13 verbose stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:288:5)
14 verbose pkgid exercise-13@1.0.0
15 verbose cwd /Users/jseidel/dev/egghead-beginners-guide-nextjs/exercises/exercise-13--use-the-server-side-rendering-method
16 verbose Darwin 20.6.0
17 verbose argv "/Users/jseidel/.nvm/versions/node/v14.17.0/bin/node" "/Users/jseidel/.nvm/versions/node/v14.17.0/bin/npm" "run" "build"
18 verbose node v14.17.0
19 verbose npm  v6.14.13
20 error code ELIFECYCLE
21 error errno 1
22 error exercise-13@1.0.0 build: `next build`
22 error Exit status 1
23 error Failed at the exercise-13@1.0.0 build script.
23 error This is probably not a problem with npm. There is likely additional logging output above.
24 verbose exit [ 1, true ]

Why is it looking at exercise 7 when I'm trying to build exercise 13?

So I figured, what the heck, I'll just remove exercise-07 completely so that it can't cause a problem.

But now, when I try to build exercise-13, it's complaining about exercise-09!

npm run build

> exercise-13@1.0.0 build /Users/jseidel/dev/egghead-beginners-guide-nextjs/exercises/exercise-13--use-the-server-side-rendering-method
> next build

Browserslist: caniuse-lite is outdated. Please run:
  npx browserslist@latest --update-db
  Why you should do it regularly: https://github.com/browserslist/browserslist#browsers-data-updating
Failed to compile.

../exercise-09--create-custom-style/pages/_app.tsx:7:11
Type error: 'Component' cannot be used as a JSX component.
  Its element type 'ReactElement<any, any> | Component<{}, any, any> | null' is not a valid JSX element.

   5 |
   6 | const App = ({ Component, pageProps }: AppProps) => {
>  7 |   return <Component {...pageProps} />
     |           ^
   8 | }
   9 |
  10 | export default App
info  - Checking validity of types .npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! exercise-13@1.0.0 build: `next build`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the exercise-13@1.0.0 build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/jseidel/.npm/_logs/2022-10-29T13_06_41_926Z-debug.log
@nikolovlazar
Copy link
Owner

Thanks for opening this issue @JESii. I'll be taking a look one of these days and will let you know.

@nikolovlazar
Copy link
Owner

nikolovlazar commented Dec 30, 2022

@JESii which node/npm versions did you use? I just ran npm build inside exercises/exercise-13--use-the-server-side-rendering-method and it didn't fail. I'm using node version v16.14.2 and npm version 8.5.0. Can you try with these versions, and if it works I'll update the README.md file to let other students know about the node/npm versions.

Also, sorry for the late reply.

@nikolovlazar
Copy link
Owner

@JESii I pushed a new comment that fixes the package versions and resolutions. I think the issue might be in the resolutions property in the package.json file. Can you pull the latest change and try again?

Fix: 3bd9d21

@JESii
Copy link
Author

JESii commented Dec 31, 2022 via email

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants