fs.readdirSyn c не является функцией - электрон + реакция. js - PullRequest
1 голос
/ 28 февраля 2020

Я пытаюсь написать электрон приложение с React. js, и это приложение обращается к файловой системе.

Вот мой fileWalker.js:

const path = require('path');
const fs = require('fs');

function *walkFolders (folder, recurseLevel = 0) {
  try {
    const files = fs.readdirSync(folder);

    for (const file of files) {
      try {
        const pathToFile = path.join(folder, file);
        const stat = fs.statSync(pathToFile);
        const isDirectory = stat.isDirectory();
        if (isDirectory && recurseLevel > 0) {
          yield * walkFolders(pathToFile, recurseLevel - 1)
        }
        else {
          yield {
            rootDir: folder,
            fileName: file,
            isDir: isDirectory,
            stat: stat
          }
        }
      }
      catch (err) {
        yield {
          rootDir: folder,
          fileName: file,
          error: err
        }
      }
    }
  }
  catch (err) {
    yield {
      rootDir: folder,
      error: err
    }
  }
}

export default walkFolders;

Тогда в моем App.js я написал:

  getFolders(absolutePath) {
    let folders = [];
    // check incoming arg
    if (!absolutePath || typeof absolutePath !== 'string') {
      return folders
    }
    for (const fileInfo of walkFolders(absolutePath, false)) {
      // all files and folders
      console.log(fileInfo);
      if ('error' in fileInfo) {
        console.error(`Error: ${fileInfo.rootDir} - ${fileInfo.error}`);
        continue
      }
      // we only want folders
      if (!fileInfo.isDir) {
        continue
      }
      const node = this.createNode(fileInfo)
      folders.push(node)
    }
    return folders
  }

   ...
  componentDidMount() {
    this.getFolders("E:/gits");
  }
  constructor(props){
    super(props);
    this.getFolders=this.getFolders.bind(this);
    ...
  }
...

Но я получаю эту ошибку:

TypeError: fs.readdirSync is not a function

enter image description here

Как мне решить эту проблему?

1 Ответ

1 голос
/ 28 февраля 2020

Кажется, ошибка конфигурации Webpack. Значение по умолчанию target в веб-пакете - «Интернет». В электронном js это должно быть electron-renderer.

Если вы создали приложение реагирования с помощью create-реагировать-приложение, то вам нужно извлечь конфигурации веб-пакета и обновить их.

Или, если вы не можете извлечь средства из веб-пакета, есть несколько вариантов.

Используя react-app-rewired, мы можем переопределить конфигурации веб-пакета.

1) Устанавливаем перереагирующее приложение-приложение

Для создания-реакт-приложения 2.x с Webpack 4:

$ npm install react-app-rewired --save-dev

Для создания-реагирующего-приложения 1.x или реаги -scripts-ts с Webpack 3:

$ npm install react-app-rewired@1.6.2 --save-dev

2) Создать config-overrides. js файл в каталоге root

module.exports = function override(config, env) {
  config.target = 'electron-renderer';
  return config;
}

3) «Отразить» существующие вызовы реагирующих скриптов в npm скриптах для запуска, сборки и тестирования

/* package.json */

  "scripts": {
-   "start": "react-scripts start",
+   "start": "react-app-rewired start",
-   "build": "react-scripts build",
+   "build": "react-app-rewired build",
-   "test": "react-scripts test --env=jsdom",
+   "test": "react-app-rewired test --env=jsdom",
    "eject": "react-scripts eject"
}

Затем запустите сервер. Это может быть работа. : -)

...