How to use fs

[borovez]

How do I use fs in my main vue app, I need to store data in the users temp folder...?

[RajvirSingh1313]

Hey @borovez, So it is pretty simple. I have done exact same thing with one of my client's projects. So the method that I use was that I made an express API in the electron.js and used routes to make the electron.js less messy, and then I set the endpoint as any other database API would do, you can use Axios then to make post, get requests to add, update, delete data. As you told, you want to use fs, then you can just do the same thing instead of using any database just use fs to manipulate the database, as I used sqlite3 in my case. Anyways if you didn't understand what I said, then you can ask me for some examples, I will be happy to help you.

[borovez]

@RajvirSingh1313 Hey, thank you for the fast response!

To preface, I am working on Windows 10 via WSL 2 Ubuntu...

Okay I understand now that I should be building the API using express, and I notice there is an electron.js file in the root project of the boilerplate code which has some routes already.

Question

How should I run this electron.js? Do I need to run this seperately from the npm run serve using mymain.js? Usingnpm run serve like so, would that suffice?:

package.json

 "scripts": {
    "serve": "vue-cli-service serve && electron .",

Question

Also, unrelated, but the npm run build, the dist that is generated is just the compiled website files, how do I then package this into an .exe for windows 10? (I am new to electron.js) - should I be using electron-packager?

electron-packager . ExpenseCalculator --platform=win32 --arch=x64 --overwrite                                           

---

Solved

Using electron-builder, modified package.json to add the following config under "build".

"win": {
      "icon" : "build/images/icon.ico",
      "target": ["portable"]
    },

Question

Lastly, in terms of calling the axios requests, assuming I can get the express server to start (not sure how), would I be sending the requests to the localhost url with the port 5001 specified in the electron.js file? Like so, doesn't seem to work for me:

 axios.get('http://localhost:5001/app-details')

Thanks!

---

Unrelated

Aside: I keep getting the following error when I run npm run build

Error: Cannot find module 'fs/promises'

I solved the above build error by upgrading node to version ^16

[RajvirSingh1313]

So, let me start with your first question.

Solution 1

You need to run this command to make it work

And if you just want to like develop the API and use postman to test it. Then you can make a separate file like server.js, and copy and past the express related things from electron.js. After that, you can install nodemon for like reloading of the API every time you make a change in serever.js. And at last, make a script command in package.json like this

"scripts":{
      "server":"nodemon server.js"
}

And when you will be finished making the API then you can just copy the content of the server.js and past it into electron.js

Solution 3

So yeah you would be sending requests to 5001 or the port mentioned in the electron.js. There is one little thing that you need to know is that this method is only good if your project is just a side project or a small project in which you are not transferring sensitive data, as users will also be aware of the express API. I am working on this right now, about every secure way to contact with electron.js, I tried IPC but isn't working right and needs a lot of boilerplate. So I am researching some other ways which can be easier to set up and easier to use. I hope I can make it someday.

I think these two were the only questions, as you solved the others yourself. So have a good day!

[RajvirSingh1313]

@borovez Should I close this issue if your doubts are cleared?