In Nextjs, I tried the mutate in SWR and works as expected in developement mode.... like validation after posting the data and revalidation from the /api/get is working as expected. but after building next js using npm run build and npm run start, mutate is not validating the data.
'use client'
import useSWR from "swr";
import axios from 'axios';
import { useState } from "react";
export default function Home() {
const getfetcher = async (...args) => await fetch(...args).then((res) => res.json())
const { data, error, isLoading, mutate } = useSWR(`/api/get`, getfetcher)
const [message,setMessage] = useState()
const test = async (e) => {
e.preventDefault();
const email = e.target[0].value;
const username = e.target[1].value;
const password = e.target[2].value;
try{
await axios.post('/api/posts',{email,username,password}).then((res) => {
setMessage(res)
})
// mutate('/api/get',(posts) => [data, ...posts],false);
mutate();
}
catch(err){
console.log('this is an error',err)
}
}
console.log(data)
console.log(message)
return (
<main>
<form onSubmit={test} method="POST">
<input type="text" name="email" className="border border-blue-500 px-3 py-1" placeholder='email'></input>
<input type="text" name="username" className="border border-blue-500 px-3 py-1" placeholder='username'></input>
<input type="text" name="password" className="border border-blue-500 px-3 py-1" placeholder='password'></input>
<button type="submit" className="border bg-blue-500 text-white px-3 py-1">Submit</button>
</form>
</main>
)
}
this is the build log after running the npm run build
✓ Linting and checking validity of types
✓ Collecting page data
Generating static pages (1/7) [= ]
undefined
Generating static pages (6/7) [=== ]
✓ Generating static pages (7/7)
✓ Collecting build traces
✓ Finalizing page optimization
Creating an optimized production build .Route (app) Size First Load JS
┌ ○ / 24 kB 104 kB
├ ○ /_not-found 883 B 81.3 kB
├ λ /api/delete/deletevehicle/[id] 0 B 0 B
├ ○ /api/get 0 B 0 B
└ λ /api/posts 0 B 0 B
+ First Load JS shared by all 80.4 kB
├ chunks/864-01ebf6bbfdef24bb.js 27.5 kB
├ chunks/fd9d1056-fcb8f27f999df908.js 51 kB
├ chunks/main-app-2cc8802d4fa4d626.js 234 B
└ chunks/webpack-aa48c2a6680c7f21.js 1.69 kB
λ (Server) server-side renders at runtime (uses getInitialProps or getServerSideProps)
○ (Static) automatically rendered as static HTML (uses no initial props)
Am i missing something? Any help appreciated.