electron-vue開發爬坑指南

electron-vue開發遇到的爬坑過程，遇到了如下幾種坑：

 

1:靜態資源目錄訪問不了，想訪問放在static目錄下的靜態資源，使用express指定靜態目錄訪問不到，解決辦法：使用electron-vue配置的__static這個全局變量能夠訪問到：　　

url: __static+'/pdf/pdf/web/viewer.html?file='+__static+'/pdf/2.pdf'

2:訪問本地目錄讀寫文件，能夠在vue文件內直接使用fs，windows下路徑能夠按照本地盤符地址寫（路徑中\的需改成\\）

var fs = require("fs");
fs.writeFile("D:\\test.txt", "HelloWorld", { flag: "a" }, err => {
if (err) {
throw err;
}
// 寫入成功後讀取測試
fs.readFile("D:\\test.txt", "utf-8", (err, data) => {
if (err) {
throw err;
}
this.mydata = data;
});
});

 

3:渲染進程和主進程通訊，須要採用electron-vue的特定方式

//渲染進程
this.$electron.ipcRenderer.send("ping");
this.$electron.ipcRenderer.on("pong", (event, data) => {
      console.log(data);
});

// 主進程
ipcMain.on('ping', (event, data) => {
  event.sender.send('pong', Math.random())
})

 4:使用electron-builder打包的時候，須要把打包的icon配置到build目錄下，若是想在窗口左上角顯示icon，必須使用png格式的圖片作icon，尺寸爲256*256，若是icon的目錄制定到別的目錄下，會各類報錯，很是難排查錯誤緣由

"win": {
      "icon": "build/icons/icon.png"
    },