详解如何在Electron中存取本地文件

const {
   app
} = require('electron');
const fs = require('fs');
const path = require('path');

const filePath = path.join(app.getPath('userData'),'/myfile.txt'); // Example file path

try {
   fs.writeFileSync(filePath, 'hello world', 'utf-8');
} catch (e) {
   console.error('Failed to save the file!');
}

const {
   dialog
} = require('electron').remote;
const fs = require('fs');

const options = {
   title: 'Save file',
   defaultPath: 'my_filename',
   buttonLabel: 'Save',
   filters: [{
         name: 'txt',
         extensions: ['txt']
      },
      {
         name: 'All Files',
         extensions: ['*']
      },
   ],
};

dialog.showSaveDialog(null, options).then(({
   filePath
}) => {
   if (filePath) {
      fs.writeFileSync(filePath, 'hello world', 'utf-8');
   }
});

// 主进程 ->  main.js

// .... ohter code
// ... 在主进程注册我们封装后的 SaveFile 方法
const { app, BrowserWindow, ipcMain, dialog} = require("electron");
const path = require("path");
const fs = require('fs');

/**
 * @param options: { title:  String, defaultPath: String, buttonLabel: String, filters: area}
 * @param content: String
 * @returns Promise
 */
ipcMain.handle('saveFile', async (event, content, options) => {
  let path;
  try {
  const { filePath } =  await dialog.showSaveDialog(null, options);
    path = filePath;
  } catch(e) {
    return Promise.reject({error: e, success: false});
  }
  if(path) {
    try {
      fs.writeFileSync(path, content, 'utf-8');
      return Promise.resolve({error: null, success: true});
    } catch(e) {
      return Promise.reject({error: e, success: false});
    }
  } else {
    return Promise.reject({error: e, success: false, canceled: true});
  }
});

// 其他代码 ....

// Vue 文件、
// 在我们，的Vue 业务中。直接通过 ipc 调用

<script setup>
  import {reactive, ref, onMounted} from "vue";
  const textContent = ref('hello world');
  const { ipcRenderer } = require('electron');

  const exportImg = async () => {
    try {
            // 注意->  第一个参数，为 主进程注册进来的方法名称。 
      // 其他参数为， 主进程注册的函数参数。
      await ipcRenderer.invoke('saveFile', 'hello', {
        title: '导出图片',
        buttonLabel: '导出',
        defaultPath: 'text.txt',
        filters: [{
         name: 'All Files',
         extensions: ['*']
          }]
      })
    } catch(e) {
      console.error('出错了！', e)
    }
  }
</script>
<template>
    <a-config-provider :csp="{ nonce: 'YourNonceCode' }">
      <a-button type="primary" @click="exportImg">导出</a-button>
  </a-config-provider>
</template>