electron踩坑

1. electron Unable to find Electron app at

出現這種問題，我們應該第一時間查看你的package.json文件中的main是不是指向electron的開始文件。

2. electron窗口打開後沒內容

先查看你的electron 主進程是否加載，監聽項目運行的端口

再查看配置文件webpack.config.js中的devServer的配置

devServer: {
    contentBase: path.join(__dirname, "dist"), //編譯好的文件放在這裏
    compress: true,
    port: 9000 //本地開發服務器端口
},

3.項目運行後，打開開發者工具，刷新頁面報錯

使用run-electron 插件。

npm install run-electron electron

將原來的electron . 替換成run-electron .

打包electron

我使用的是electron-builder

// 安裝全局的electron-builder
$sudo npm install electron-builder -g
// 項目安裝
$npm install electron-builder

打包成功後window 7上運行報錯

最後發現是依賴安裝不全導致。

打包完成後運行報錯

Not allowed to load local resource

// 打包的main入口文件和Dev時的有區別。不然找不到路徑
  mainWindow.loadURL(url.format({
    pathname: path.join(__dirname, './index.html'),
    protocol: 'file:',
    slashes: true
  }))