vue.js - 在 Vue 中使用电子事件时如何修复未定义的 __dirname?
问题描述
我使用nklayman/vue-cli-plugin-electron-builder创建了一个使用 Vue/Vuex 准备的电子应用程序。它附带文件main.js
,background.js
包括 Vue 组件起点。但我无法让这些事件发挥作用。我在下面的尝试Uncaught ReferenceError: __dirname is not defined
在渲染时会产生(编译很好)。
组件:Splash.vue
<template>
<div @click="open">open</div>
</template>
<script>
const { ipcMain } = require('electron')
export default {
methods: {
open()
{
ipcMain.on('my-open-event', (event, arg) => {
console.log(event, arg)
})
}
}
}
</script>
背景.js
import { app, protocol, BrowserWindow } from 'electron'
...
app.on('my-open-event', async () => {
try {
"Will call some executable here";
} catch (e) {
console.error(e)
}
})
main.js
import Vue from 'vue'
import App from './App.vue'
import store from './store'
Vue.config.productionTip = false
new Vue({
store,
render: h => h(App)
}).$mount('#app')
完整错误:
Uncaught ReferenceError: __dirname is not defined
at eval (webpack-internal:///./node_modules/electron/index.js:4)
at Object../node_modules/electron/index.js (chunk-vendors.js:1035)
at __webpack_require__ (app.js:849)
at fn (app.js:151)
at eval (webpack-internal:///./node_modules/cache-loader/dist/cjs.js?!./node_modules/babel-loader/lib/index.js!./node_modules/cache-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./src/components/Splash.vue?vue&type=script&lang=js&:6)
at Module../node_modules/cache-loader/dist/cjs.js?!./node_modules/babel-loader/lib/index.js!./node_modules/cache-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./src/components/Splash.vue?vue&type=script&lang=js& (app.js:986)
at __webpack_require__ (app.js:849)
at fn (app.js:151)
at eval (webpack-internal:///./src/components/Splash.vue?vue&type=script&lang=js&:2)
at Module../src/components/Splash.vue?vue&type=script&lang=js& (app.js:1271)
任何想法我做错了什么?
解决方案
为了解决这个问题,我vue.config.js
在项目根目录中创建了一个包含内容的文件
module.exports = {
pluginOptions: {
electronBuilder: {
nodeIntegration: true
}
}
}
推荐阅读
- mongodb - MongoDB 查询中 db.collection.count({}) 和 db.collection.count() 的不同计数
- ruby-on-rails - 让 RVM 读取 rbenv 文件
- mongodb - 使用 $and、$or 的 Mongo 数组查询
- reactjs - PropTypes 导致表单刷新 onSubmit redux-form
- openstack - openstack 计算服务列表 --service nova-compute 安装 nova 后返回空行
- azure - 即使使用 sudo,Yeoman 也会给出权限错误
- java - 写入内部存储
- multi-tenant - TenantAccessor.getCurrentTenant() 抛出 TenantNotAvailableException:无法获取当前租户:没有可用的请求
- php - 调用 dispatch 时 Lumen 内存不足
- server - 如何在谷歌云上找到私有IP地址?