Tauri - How can I read a file inside the project folder?

Question

I use the Tauri JS on Ubuntu. I would like to read a csv file which is in the project directory.

/data/example.csv
/src-tauri/
/src
...

I activated the fs module, I tried different patterns

"all": true,
      "fs": {
        "scope": {
          "allow": ["$APP/**", "$APP/db/**", "$APP/data/**" ,"$DOWNLOAD/**", "$RESOURCE/**", "/data/**", "data/**"]
        }
      },

But when I try to read with the following code:

import { readTextFile } from "@tauri-apps/api/fs";

let filePath = "./data/example.csv";
console.log("File path:", filePath)
const promise = readTextFile(filePath);
promise.then((response) => {
    console.log(response);
}).catch((error) => {
    console.error(error);
})

I always get the following error:

[Error] path not allowed on the configured scope: ./data/profiles.csv

Trull

Answer 1

write this

import { resourceDir } from '@tauri-apps/api/path';
const resourceDirPath = await resourceDir();
console.log(resourceDirPath)

$ npm run tauri dev
console log show this

yourApp\src-tauri\target\debug

$ npm run tauri build
console log show this

yourApp\src-tauri\target\release

https://tauri.app/v1/api/js/modules/path/#resourcedir

Nerver forget this setting

 "fs": {
        "all": true,
        "scope": [
          "$RESOURCE/*"
        ]
      },

Diptych

Your answer could be improved by adding an explanation of the code you supplied. – Saraann

Answer 2

This one worked for me. You need an additional dir: path option, when you call readTextFile. I used it with Tauri - BaseDirectory and continue with the relative path. Maybe it works just with a filepath as well.

1. With await:

   import {
     BaseDirectory,
     readTextFile
   } from "@tauri-apps/api/fs";
   
   export const readFile1 = async() => {
     try {
       const result = await readTextFile("file.txt", {
         dir: BaseDirectory.App,
       });
       console.log("result: " + result);
       return result;
     } catch (error) {
       console.log(error);
       return false;
     }
   };

2. With promise, adjusted to your example:

export const readFile2 = async() => {
  let filePath = "data\\example.csv";
  let appPath = BaseDirectory.App;
  console.log("File path:", filePath);
  const promise = readTextFile(filePath, {
    dir: appPath,
  });
  promise
    .then((response) => {
      console.log(response);
    })
    .catch((error) => {
      console.error(error);
    });
};

For completeness, my tauri.conf.json content:

...
"tauri": {
  "allowlist": {
    "fs": {
      "all": true,
      "scope": [
        "$APP/*",
        "$DESKTOP/*"
      ]
    }
  },
  ...

If you replace the file with a wrong one "notThere.txt", the error will display the path in the console where it is looking. I had the same problem. You can open the console in the tauri app with (ctrl+shift+i) or right click.

For others, who try to get it work: you need to add the tauri-api to your project: yarn add -D @tauri-apps/api.

A blog post from matthewtao helped me a lot. He applies different methods from Tauri, like read/write file or create a directory with Tauri.

• github/Glipma example from him using Svelte is awesome

Spinescent