3

I am trying to write some stuff in a file using reactJS and nodeJs but it doesnt work. Here is my code, is a simple one and i get that fs.writeFile is not a function. I get this error for each function that i use from fs. In node_module i have the folder for fs but inside i only have package.json and a readme. I dont know what to do, i searched online for answers but nothing. Any help would be awesome

import React, { Component } from 'react'

const fs = require('fs');

export default class WriteFile extends Component {

write = () => {
    fs.writeFile("file.txt", "Hey there!", function(err) {
        if(err) {
            return console.log(err);
        }

        console.log("The file was saved!");
    }); 
}

render() {
    return (
    <div>
        <button className='btn btn-info' onClick={this.write}>scria-ti-as</button>
    </div>
    )
 }
}

and the error

TypeError: fs.writeFile is not a function

WriteFile._this.write

D:/js/login_reactjs/src/components/WriteFile.js:8

5 | export default class WriteFile extends Component {

6 | 

7 |     write = () => {

8 |         fs.writeFile("file.txt", "Hey there!", function(err) {

9 |             if(err) {

10 |                 return console.log(err);

11 |             }
Horatiuw
  • 179
  • 2
  • 2
  • 12

2 Answers2

10

fs will not work in the browser. This is by design. fs has been stubbed out See this ticket

You would have better luck using packages that support browsers like browserify or browserFS

PrivateOmega
  • 2,509
  • 1
  • 17
  • 27
0

In browser you should use File API to access files - https://www.html5rocks.com/en/tutorials/file/dndfiles/

Also take a look at https://electronjs.org/ It allows you to use nodejs APIs like fs in you "native"-like react app.

zag2art
  • 4,869
  • 1
  • 29
  • 39