En un archivo JSON, guardo datos para un bot en total.json .
{ "guilds": 3, "users": 21 } En mi index.tsx , me gustaría poner estos datos en la página, así que intento esto:
import fs from 'fs'; function stats() { const botcount = JSON.parse(fs.readFileSync(`../util/total.json`, { encoding: 'utf8' })); const userscount = botcount.users; console.log(userscount); return userscount; }En la terminal, la función devolvió correctamente el número ( 21 ), pero en mi página encontré este error:
TypeError: fs__WEBPACK_IMPORTED_MODULE_6___default(...).readFileSync is not a functionSolo puede usar el módulo fs en Node js NO en el navegador. Para acceder a datos JSON desde un archivo en Nextjs, puede usar axios o fetch . Aquí hay un ejemplo con axios
import axios from 'axios'; async function stats() { var {data} = await axios.get("http://localhost:8888/utils/total.json");//Change this to your url const botcount = JSON.parse(data) const userscount = botcount.users; console.log(userscount); return userscount; }Como @JaivBhup ya mencionó, no puede usar fs ya que no es compatible con el navegador .
En mi opinión, un mejor enfoque es usar un backend y obtener datos desde allí ( axios es un gran paquete para esto). Si no tiene un back-end de algún tipo, debería considerar usar las rutas api de Next.js.
¡Puede usarlo como si hubiera estado usando Node.js!
Consulte los documentos o esto también podría ser útil para usted.
// File: pages/api/my-json.js import fs from 'fs' import path from 'path' export default (req, res) => { // Let's say your json is in /public/assets/my-json.json const filePath = path.resolve('./public', 'assets', 'my-json.json'); const json = fs.readFileSync(filePath); res.statusCode = 200 res.json(json); }La parte importante es
path.resolve(...), que le indica a vercel que incluya la ruta escaneada en la lambda sin servidor. ¡El código que se muestra funciona para leer imágenes (u otros archivos de su fs) tanto local como remotamente en vercel!
Lo modifiqué un poco, por lo que carga el archivo json en lugar de los nombres de archivo.