fs.writeFile is not working on my ReactJs / NodeJs app

Question

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 |             }

Try import fs from 'fs' instead of const fs = require('fs'); — S.Haviv
– S.Haviv, Commented Mar 22, 2019 at 14:25
@S.Haviv now i get this error: TypeError: fs__WEBPACK_IMPORTED_MODULE_6___default.a.writeFile is not a function — Horatiuw
– Horatiuw, Commented Mar 22, 2019 at 14:29
How did you create your react app? using create-react-app command? — S.Haviv
– S.Haviv, Commented Mar 22, 2019 at 14:31

PrivateOmega · Accepted Answer · 2019-03-22 14:49:58Z

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

edited Mar 22, 2019 at 14:49

answered Mar 22, 2019 at 14:33

PrivateOmega

2,9401 gold badge19 silver badges28 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Horatiuw Over a year ago

and what if i have to use some external functions that use file-system?

PrivateOmega Over a year ago

@Horatiu123456 use browserify or some similar packages.

PrivateOmega Over a year ago

@Horatiu123456 See this ticket

zag2art · Accepted Answer · 2019-03-22 14:53:56Z

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.

answered Mar 22, 2019 at 14:53

zag2art

5,2022 gold badges31 silver badges40 bronze badges

Collectives™ on Stack Overflow

fs.writeFile is not working on my ReactJs / NodeJs app

2 Answers 2

3 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related