文章目录

• • 导读
  • • 需求
    • 开发环境
  • 判断是否是开发环境
  • • 方案一：location.protocol
    • 方案二：全局变量`__static`
    • 方案三：全局变量`process.resourcesPath`
    • 方案四：全局变量`process.env.WEBPACK_DEV_SERVER`
    • 方案五：app.isPackaged
  • 获取配置目录
  • 参考资料

导读

以下内容在https://gitee.com/zkyt/electron-vue-element-admin上做的。

需求

electron作为一个客户端应用，往往需要处理配置文件，开发环境和生产环境的目录有些不同，我们需要判断当前环境，来读取不同目录的配置。

开发环境

判断是否是开发环境

方案一：location.protocol

开发环境中：location.protocol == 'http:'。

方案二：全局变量__static

开发环境全局变量__static包含node_modules目录。

方案三：全局变量process.resourcesPath

开发环境全局变量process.resourcesPath包含node_modules目录。

方案四：全局变量process.env.WEBPACK_DEV_SERVER

开发环境全局变量process.env.WEBPACK_DEV_SERVER值为'true'。

方案五：app.isPackaged

const { app } = require(‘electron’)
这个app只能在Main进程使用，Render进程要使用的话，需要设置通过一些技术手段设置进来（如preload.js），这里不详细展开了。

参考资料：https://www.electronjs.org/zh/docs/latest/api/app

获取配置目录

从上面各种方案中，我们可以看出，方案三最适合获取配置目录。
代码如下：

function get_data_path() {let idx = process.resourcesPath.indexOf('\\node_modules\\');if (idx == -1) {// 生成环境return process.resourcesPath + '\\..\\_data\\';} else {// 开发环境return process.resourcesPath.substring(0, idx) + '\\_data\\';}
}
get_data_path();

效果如下：

参考资料

• 代码地址： https://gitee.com/zkyt/electron-vue-element-admin
• 【electron】 打包应用修改图标和进程名字 https://blog.csdn.net/kinghzking/article/details/127952519