Electron 开发版和生产版不同

Question

我使用 Electron-vue 和 electron-builder 开发了我的应用，目标操作系统是 Windows exe App。

但我发现在开发模式下它可以工作，但是当我构建它时，某些功能不起作用。

好像和electron-update包相关的功能不工作了。

例如，以开发模式运行，似乎版本文本与此代码配合得很好。但在生产模式下，该版本似乎无法正常工作。

但是它在开发模式下有一些错误，我不知道为什么我应该把我的 app-update.yml 文件放在 node_modules 文件夹中。它应该放在其他地方，因为 .ignore 文件忽略了 node_modules 文件夹。如何处理 app-update.yml 目录路径？

┏ Electron -------------------

  16:46:23.785 > Checking for update

┗ ----------------------------

┏ Electron -------------------

  Window "main-window" was created

┗ ----------------------------

┏ Electron -------------------

  16:46:23.915 > Error: Error: ENOENT: no such file or directory, open 'C:\myapp\node_modules\electron\dist\resources\app-update.yml'

┗ ----------------------------

┏ Electron -------------------

  (node:20808) UnhandledPromiseRejectionWarning: Error: ENOENT: no such file or directory, open 'C:\myapp\node_modules\electron\dist\resources\app-update.yml'

┗ ----------------------------

┏ Electron -------------------

  (node:20808) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 1)
  (node:20808) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.       

┗ ----------------------------

<template>
  <Window title='Program Updater'>
    <div class='wrap' id='currentAppVersion'>
      Current App Version : {{currentAppVersion}}
    </div>
    <div class='wrap' id='checkNewVersion'>
      Latest App Version : {{latestAppVersion}}
    </div>
  </Window>
</template>

<script>
import Window from '@/components/Window'
import Icon from '@/components/Icon'

export default {
  name: 'update-window',

  components: {
    Window,
    Icon
  },
  data () {
    return {
      // appVersion: app.getVersion()
      currentAppVersion: process.env.npm_package_version,
      latestAppVersion: 'Not yet Developed'
    }
  }
}
</script>

[开发模式]

[生产模式构建]

这是我的 package.json

package.json

{
  ...
  "main": "./dist/electron/main.js",
  "scripts": {
    "build": "node .electron-vue/build.js && electron-builder",
    "build:dir": "node .electron-vue/build.js && electron-builder --dir",
    "build:clean": "cross-env BUILD_TARGET=clean node .electron-vue/build.js",
    "build:web": "cross-env BUILD_TARGET=web node .electron-vue/build.js",
    "dev": "node .electron-vue/dev-runner.js",
    "dev:tray": "node .electron-vue/dev-runner.js -- --systray",
    "lint": "eslint --ext .js,.vue -f ./node_modules/eslint-friendly-formatter src",
    "lint:fix": "eslint --ext .js,.vue -f ./node_modules/eslint-friendly-formatter --fix src",
    "pack": "npm run pack:main && npm run pack:renderer",
    "pack:main": "cross-env NODE_ENV=production webpack --progress --colors --config .electron-vue/webpack.main.config.js",
    "pack:renderer": "cross-env NODE_ENV=production webpack --progress --colors --config .electron-vue/webpack.renderer.config.js",
    "postinstall": "npm run lint:fix",
    "publish": "build --win -p always",
    "deploy": "electron-builder build --win --publish always"
  },
  "build": {
    "productName": "Geomec Cloud Manager",
    "appId": "com.apps.geomec-cloud-manager",
    "artifactName": "Geomec-Cloud-Manager-Setup-v${version}.${ext}",
    "nsis": {
      "oneClick": true,
      "installerIcon": "build/icons/setup-icon.ico",
      "uninstallDisplayName": "Geomec Cloud Manager"
    },
    "directories": {
      "output": "build"
    },
    "files": [
      "dist/electron/**/*"
    ],
    "win": {
      "icon": "build/icons/app-icon.ico"
    }
  },
  "dependencies": {
    "electron-log": "^4.3.2",
    "electron-updater": "^4.3.8",
    "electron-window-manager": "github:evsar3/electron-window-manager",
    "uuid": "^7.0.2",
    "v-tooltip": "^2.0.3",
    "vue": "^2.6.12",
    "vue-electron": "^1.0.6",
    "vue-js-toggle-button": "^1.3.3",
    "vue-router": "^3.4.3",
    "vue-switches": "^2.0.1",
    "vuedraggable": "^2.24.1",
    "vuex": "^3.0.1",
    "vuex-electron": "^1.0.0"
  },
  "devDependencies": {
 ........
}

Answer 1

根据#4468，npm_package_version 是由 npm 设置的，而不是 Electron

你应该改用app.getVersion()

返回 String - 已加载应用程序的版本。如果在应用程序的 package.json 文件中没有找到版本，则返回当前包或可执行文件的版本。