Question

178

Read file component (fs.readFile)

rated 0 times [ 182] [ 4] / answers: 1 / hits: 8959 / 4 Years ago, wed, june 17, 2020, 12:00:00

Im getting an error stating that fs.readFile is not a function. What am I not understanding about how to use fs.readFile?

https://www.geeksforgeeks.org/node-js-fs-readfile-method/

The objective here is to get the contents of my file into a variable and parse thought the value further.

import React from 'react';





const fs = require('fs')



const ToolTipTextMod = (props) => {

    let txt = null;

    fs.readFile('../../components/ToolTip/ToolTipText.txt',(err, data) => {console.log(data)})



    return(

        <p>{txt},{props.textId}</p>



    );

}



export default ToolTipTextMod;

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

terrence

Add To Favorites

Follow

Total Points: 120

Total Questions: 115

Total Answers: 87

Location: England

Member since Fri, May 22, 2020

4 Years ago

terrence questions

1 Cannot read properties of undefined (reading 'toHexString') in ether.js

Sun, Mar 13, 22, 00:00, 2 Years ago

1 Javascript Remove Focus on Enter Key Press

Sat, Jun 5, 21, 00:00, 3 Years ago

1 Implementing Lodash's debounce in a ReactJS functional component

Mon, Aug 31, 20, 00:00, 4 Years ago

1 How to customize mat select option group to allow nested values in angular

Thu, Jul 23, 20, 00:00, 4 Years ago

1 auto read SMS/OTP in react PWA

Tue, May 26, 20, 00:00, 4 Years ago

View All

answered 4 Years ago lexusg · Accepted Answer

fs is a Nodejs module. So I would recommend using a package like raw-loader , but for that you need to have webpack setup.

So alternate way is to simply use fetch/Axios.

Example:

 import React, {useState,useEffect} from react;

 import txt from ./test.txt; // Your file path 

 import Axios from axios; // Import Axios or use Fetch.





const ToolTipTextMod = (props) => {

const [text,setText] = useState();



useEffect(()=>{

   Axios(txt).then(res => setText(res.data)); // This will have your text inside data attribute

},[])



return <p>/* code */</p>



}