Next.js Discord

Discord Forum

Fetching error Nextjs Dashboard project

Unanswered
Schweizerischer Niederlaufhund posted this in #help-forum
Open in Discord
Schweizerischer NiederlaufhundOP
Hi!
I'm going through this learn project: https://nextjs.org/learn
In chapter 7 we're fetching data, and everything is running smoothly until I get to this part:
https://nextjs.org/learn/dashboard-app/fetching-data#fetching-data-for-revenuechart

When I add the import for fetchRevenue, and create a revenue const:
import { Card } from '@/app/ui/dashboard/cards';
import RevenueChart from '@/app/ui/dashboard/revenue-chart';
import LatestInvoices from '@/app/ui/dashboard/latest-invoices';
import { lusitana } from '@/app/ui/fonts';

//This step ...
import { fetchRevenue } from '@/app/lib/data';
 
export default async function Page() {
// ... and this step
  const revenue = await fetchRevenue();
}

... I get this error:

Server Error

Error: error - node_modules/node-gyp-build/node-gyp-build.js:22:10 Error resolving commonjs request

20 |
21 | function load (dir) {
22 | return runtimeRequire(load.resolve(dir))
| ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
23 | }
| ^
24 |
25 | load.resolve = load.path = function (dir) {
26 | dir = path.resolve(dir || '.')
unable to resolve dynamic
It was not possible to find the requested file.
Parsed request as written in source code: dynamic
Path where resolving has started: [project]/node_modules/node-gyp-build/node-gyp-build.js
Type of request: commonjs request
Import map: No import map entry

This error happened while generating the page. Any console logs will be displayed in the terminal window.

Here's the repo:
https://github.com/AMarlonG/Next.ja-14-Server-Actions/tree/main/nextjs-dashboard

I'm totally new to this, so I have no idea what's going on here ...

5 Replies

@Schweizerischer Niederlaufhund Hi! I'm going through this learn project: https://nextjs.org/learn In chapter 7 we're fetching data, and everything is running smoothly until I get to this part: https://nextjs.org/learn/dashboard-app/fetching-data#fetching-data-for-revenuechart When I add the import for fetchRevenue, and create a revenue const: ts import { Card } from '@/app/ui/dashboard/cards'; import RevenueChart from '@/app/ui/dashboard/revenue-chart'; import LatestInvoices from '@/app/ui/dashboard/latest-invoices'; import { lusitana } from '@/app/ui/fonts'; //This step ... import { fetchRevenue } from '@/app/lib/data'; export default async function Page() { // ... and this step const revenue = await fetchRevenue(); } ... I get this error: Server Error Error: error - node_modules/node-gyp-build/node-gyp-build.js:22:10 Error resolving commonjs request 20 | 21 | function load (dir) { > 22 | return runtimeRequire(load.resolve(dir)) | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ > 23 | } | ^ 24 | 25 | load.resolve = load.path = function (dir) { 26 | dir = path.resolve(dir || '.') unable to resolve dynamic It was not possible to find the requested file. Parsed request as written in source code: dynamic Path where resolving has started: [project]/node_modules/node-gyp-build/node-gyp-build.js Type of request: commonjs request Import map: No import map entry This error happened while generating the page. Any console logs will be displayed in the terminal window. Here's the repo: https://github.com/AMarlonG/Next.ja-14-Server-Actions/tree/main/nextjs-dashboard I'm totally new to this, so I have no idea what's going on here ...
Portuguese Pointer
Hi there
You need to add import { fetchRevenue } from '@/app/lib/data';
and const revenue = await fetchRevenue();... to your app/ui/dashboard/revenue-chart"
not in your dashboard/page.tsx
Schweizerischer NiederlaufhundOP
I'm so confused, cause if you look at the route on top of the code client here, it says
/app/ui/dashboard/page.tsx

https://nextjs.org/learn/dashboard-app/fetching-data#fetching-data-for-revenuechart

But that doesn't exist. It must be a typo. They can't mean the ui, they must mean the normal app/dashboard/page route ...?

And trying your solution in revenue-chart gives me an error, since revenue already is being imported. Making a new const revenue isn't allowed.
Now what did work, and I don't know why, was commenting out line 21-23 in this file:
node_modules/node-gyp-build/node-gyp-build.js

Why did that work?