Я сделал небольшое настольное приложение для Windows, используя Electron и VueJS.
Он отлично работает, когда я запускаю его с помощью serve:
npm run serve:electron
Однако, когда я создаю приложение с помощью следующей команды, приложение выдает ошибку и оставляет пустое окно. (Снова используя vue-cli-service)
npm run build:electron
когда я использую свою консоль для cd в файл .exe и запускаю vue-autobot --debug, появляется следующая ошибка:
C:\projects\vue-autobot\dist_electron\win-unpacked>
Failed to register app protocol { Error: ENOENT, dist_electron\bundled\ not found in C:\projects\vue-autobot\dist_electron\win-unpacked\resources\app.asar
at notFoundError (ELECTRON_ASAR.js:108:19)
at fs.readFile (ELECTRON_ASAR.js:511:16)
at Function.A.n.protocol.registerBufferProtocol (C:\projects\vue-autobot\dist_electron\win-unpacked\resources\app.asar\dist_electron\bundled\background.js:1:160484) code: 'ENOENT', errno: -2 }
Шаблон: drehimself / electronic-vue-example
Мой package.json
{
"name": "vue-autobot",
"version": "0.1.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint",
"build:electron": "vue-cli-service build:electron",
"postinstall": "electron-builder install-app-deps",
"serve:electron": "vue-cli-service serve:electron"
},
"dependencies": {
"@fortawesome/fontawesome-svg-core": "^1.2.6",
"@fortawesome/free-solid-svg-icons": "^5.4.1",
"@fortawesome/vue-fontawesome": "^0.1.1",
"bootstrap-vue": "^2.0.0-rc.11",
"jquery": "^3.3.1",
"vue": "^2.5.17",
"vue-router": "^3.0.1",
"vuex": "^3.0.1"
},
"devDependencies": {
"@vue/cli-plugin-babel": "^3.0.5",
"@vue/cli-plugin-eslint": "^3.0.5",
"@vue/cli-service": "^3.0.5",
"electron": "^3.0.4",
"vue-cli-plugin-electron-builder": "^1.0.0-rc.3",
"vue-template-compiler": "^2.5.17"
},
"main": "dist_electron/bundled/background.js"
}
Это мой background.js (главный файл Electron)
'use strict'
import { app, protocol, BrowserWindow } from 'electron'
import * as path from 'path'
import { format as formatUrl } from 'url'
import {
createProtocol,
installVueDevtools
} from 'vue-cli-plugin-electron-builder/lib'
const isDevelopment = process.env.NODE_ENV !== 'production'
if (isDevelopment) {
// Don't load any native (external) modules until the following line is run:
require('module').globalPaths.push(process.env.NODE_MODULES_PATH)
}
// global reference to mainWindow (necessary to prevent window from being garbage collected)
let mainWindow
// Standard scheme must be registered before the app is ready
protocol.registerStandardSchemes(['app'], { secure: true })
function createMainWindow () {
const window = new BrowserWindow()
if (isDevelopment) {
// Load the url of the dev server if in development mode
window.loadURL(process.env.WEBPACK_DEV_SERVER_URL)
if (!process.env.IS_TEST) window.webContents.openDevTools()
} else {
createProtocol('app')
// Load the index.html when not in development
window.loadURL(
formatUrl({
pathname: path.join(__dirname, 'index.html'),
protocol: 'file',
slashes: true
})
)
}
window.on('closed', () => {
mainWindow = null
})
window.webContents.on('devtools-opened', () => {
window.focus()
setImmediate(() => {
window.focus()
})
})
return window
}
// quit application when all windows are closed
app.on('window-all-closed', () => {
// on macOS it is common for applications to stay open until the user explicitly quits
if (process.platform !== 'darwin') {
app.quit()
}
})
app.on('activate', () => {
// on macOS it is common to re-create a window even after all windows have been closed
if (mainWindow === null) {
mainWindow = createMainWindow()
}
})
// create main BrowserWindow when electron is ready
app.on('ready', async () => {
if (isDevelopment && !process.env.IS_TEST) {
// Install Vue Devtools
await installVueDevtools()
}
mainWindow = createMainWindow()
})
Я новичок в VueJS и новичок в Electron, и на данный момент я понятия не имею, что на самом деле не так.