failed build
Unanswered
Valentine ant posted this in #help-forum
Valentine antOP
occurred prerendering page "/"
Failed to fetch data
Failed to fetch data
12 Replies
Valentine antOP
$ next build
- info Creating an optimized production build
- info Compiled successfully
- info Linting and checking validity of types
- info Collecting page data
[= ] - info Generating static pages (0/5)Error: Failed to fetch data
at D:\web_tresh\Portfolio\.next\server\app\page.js:1112:15
at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
at async getData (D:\web_tresh\Portfolio\.next\server\app\page.js:1111:17)
at async MainPage (D:\web_tresh\Portfolio\.next\server\app\page.js:1117:22)
Error occurred prerendering page "/". Read more: https://nextjs.org/docs/messages/prerender-error
Error: Failed to fetch data
at D:\web_tresh\Portfolio\.next\server\app\page.js:1112:15
at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
at async getData (D:\web_tresh\Portfolio\.next\server\app\page.js:1111:17)
at async MainPage (D:\web_tresh\Portfolio\.next\server\app\page.js:1117:22)
- info Generating static pages (5/5)
> Export encountered errors on following paths:
/page: /import React, {useEffect, useState} from 'react';
import axios from "axios";
import BgMouseMove from "@/features/bgMouse";
import Aside from "@/widgets/aside";
import UserDescription from "@/shared/ui/user-description";
import ExperienceBox from "@/entities/experience";
import {IExperience} from "@/shared/type/experience";
import cl from "./style.module.scss"
async function getData() {
const res = await axios.get<IExperience[]>("http://localhost:3000/api/experience")
.catch((err) => {
throw new Error('Failed to fetch data')
})
return res.data
}
const MainPage = async () => {
const response: IExperience[] = await getData()
return (
<>
<BgMouseMove/>
<div className={cl.wrap}>
<Aside/>
<div className={cl.main}>
<UserDescription/>
<ExperienceBox data={response}/>
</div>
</div>
</>
);
};
export default MainPage;Valentine antOP
erron on build
in yarn dev its ok
in yarn dev its ok
don't fetch your own route handlers in server components
@joulev don't fetch your own route handlers in server components
Valentine antOP
how can i do it then?
@Valentine ant how can i do it then?
move the logic in your route handler to the server component itself
@joulev move the logic in your route handler to the server component itself
Valentine antOP
so this is the server component
instead of
do
// route.ts
export async function GET() {
const data = await getData();
return new Response(data);
}
// page.tsx
export default async function Page() {
const res = await fetch("http://localhost:3000/api/...");
return ...
}do
// page.tsx
export default async function Page() {
const data = await getData();
return ...
}also please change your pfp and banner for this server
we are strict in this rule and you risk getting kicked if you keep that pfp/banner
@joulev also please change your pfp and banner for this server
Valentine antOP
Ok