electron 配置特定文件右键打开

我是来人间凑数的2025-06-21 13:37

有时候我们需要将electron程序，添加到某类文件的右键打开方式中。使得应用程序能够在用户尝试打开这些文件时自动启动。

1.步骤一

配置文件配置

1.在electron的package.json文件中配置

javascript 复制代码

	"fileAssociations": [
	  {
	    "ext": ["txt"],
	    "name": "Text File",
	    "role": "Editor"
	  }
	]

关联文件类型和角色

在fileAssociations配置中，可以指定文件的扩展名（ext）、名称（name）和角色（role）。角色通常有以下几种：

Editor：编辑器角色，表示应用程序将作为这些文件的默认编辑器。

Viewer：查看器角色，表示应用程序将用于查看这些文件。

Shell：外壳角色，表示应用程序将作为这些文件的默认程序。

权限问题

在使用electron-builder进行打包时，如果遇到fileAssociations配置不生效的问题，可能是由于权限问题。在Windows系统中，可以通过设置nsis配置中的perMachine为false（默认值）来解决权限问题：

javascript 复制代码

"nsis": {
  "perMachine": false
}

2.如果项目是electron-vue ,配置信息可在vue.config.js中进行配置

javascript 复制代码

module.exports = defineConfig({
    pluginOptions:{
        electronBuilder: {
            fileAssociations:[
                {
                  ext:["md","markdown","mmd","mdown","mdtxt","mdtext"],
                  name:"Markdown",
                  description: "Markdown document",
                  role: "Editor",
                  icon: "./public/md.png"
            	}
            ],
        }
    }
})

2.步骤二

在主进程中监听打开事件并获取文件路径

javascript 复制代码

const { app } = require('electron');
app.on('open-file', (event, filePath) => {
  console.log(`File opened: ${filePath}`);
});

注意：
上述方法一定要写在初始化应用的上面，即：

javascript 复制代码

const { app } = require('electron');
app.on('open-file', (event, filePath) => {
  console.log(`File opened: ${filePath}`);
});
、、、、、
app.whenReady().then(() => {
    createWindow()
  })