vuecli+electron打包问题汇总

1.Error in script “stdin” on line 1 – aborting creation process
问题出在——文件所在路径包含了中文
解决方案:改就完了
2.Error in script “stdin” on line 74/75 – aborting creation process
问题出在——当前系统用户名包含中文
解决方案:参考https://www.cnblogs.com/kkxwze/p/12666344.html 修改user文件夹下用户名文件夹(光在用户管理下修改是没用的)
3.本地启动正常,但打包完后启动白屏
问题出在——vue的路由模式为history,但electron不支持history模式
解决方案:注释掉即可

const router = new VueRouter({
  // mode: 'history',
  base: process.env.BASE_URL,
  routes
})
### Vue2 和 Electron 项目中配置打包入口文件 `background.js` 对于 Vue2 和 Electron 的集成项目而言,在`package.json`配置文件中的`scripts`字段下可以增加一条启动命令以便于项目的快速启动[^1]。 当涉及到打包过程时,为了使应用程序能够被顺利构建并发布,通常会创建一个名为`electron-builder.json`的文件来指定打包的具体参数,比如产品名称以及需要被打包的文件列表等[^2]。 针对背景进程(即主进程),应当有一个专门的入口文件——一般命名为`background.js`。此文件负责管理原生应用窗口以及其他与操作系统交互的任务。下面是一个简单的例子展示如何设置这个文件: ```javascript const { app, BrowserWindow } = require('electron'); let mainWindow; function createWindow() { mainWindow = new BrowserWindow({ width: 800, height: 600, webPreferences: { preload: __dirname + '/preload.js', // 如果有预加载脚本的话 nodeIntegration: true, contextIsolation: false, }, }); mainWindow.loadURL(`file://${__dirname}/index.html`); mainWindow.on('closed', () => { mainWindow = null; }); } app.on('ready', createWindow); app.on('window-all-closed', () => { if (process.platform !== 'darwin') { app.quit(); } }); app.on('activate', () => { if (mainWindow === null) { createWindow(); } }); ``` 上述代码展示了基本的应用程序生命周期事件监听器定义方式,并指定了浏览器窗口的一些初始属性,如宽度、高度和Web偏好设置等。这里特别需要注意的是`webPreferences`选项内的几个重要参数:`nodeIntegration`允许页面访问 Node.js API;而`contextIsolation`则用于增强安全性,默认情况下应保持关闭状态除非确实有必要开启它[^4]。 另外,在渲染进程中如果想要调用 IPC 或者其他由主进程暴露给前端的功能,则可能需要用到`ipcRenderer`模块。考虑到 Webpack 版本差异带来的兼容性问题,有时还需要额外安装一些 polyfills 来确保所有必要的功能都能正常工作。 最后值得注意的一点是在实际开发过程中可能会遇到不同的框架组合情况,例如使用 vue-cli 构建工具链的情况就需要按照官方指南来进行相应的环境搭建[^5]。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值