vue2+electron项目搭建过程

 更新时间:2025年01月14日 09:51:13   作者:森林的尽头是阳光  
文章介绍了如何使用Vue CLI 2搭建Vue项目,并添加Electron插件vue-cli-plugin-electron-builder来创建一个Vue+Electron项目,文章还提供了启动和打包项目的方法,并提示了下载国内网较慢的文件时可以先注释掉代码进行调试,感兴趣的朋友一起看看吧

一、vue2搭建

官方链接:https://cli.vuejs.org/zh/guide/installation.html

1、安装vue-cli

npm install -g @vue/cli
# OR
yarn global add @vue/cli

2、vue项目创建

vue create electron-vue-demo

二、vue项目添加electron

安装插件 vue-cli-plugin-electron-builder

https://nklayman.github.io/vue-cli-plugin-electron-builder/guide/ 

1、安装

vue add electron-builder

2、安装成功后文件变化

package.json

三、项目运行

background.js如下代码国内网下载比较慢,是个调试工具可以先注释掉,注释后运行命令就可以快速启动客户端了

npm run electron:serve

四、项目打包

npm run electron:build

打包后,在这个目录下

打包优化

https://www.electron.build/

简单优化一下

到此这篇关于vue2+electron项目搭建的文章就介绍到这了,更多相关vue2 electron项目搭建内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • Vue项目中引入外部脚本的多种方式

    Vue项目中引入外部脚本的多种方式

    在现代的前端开发中,我们经常需要使用一些第三方的外部脚本或库,尤其是像地图、图表、分析工具等,在 Vue 项目中,有多种方式可以引入外部脚本,本文将详细介绍在 Vue 项目中引入外部脚本的几种常见方法,需要的朋友可以参考下
    2025-01-01
  • vue运行项目时network显示unavailable的问题及解决

    vue运行项目时network显示unavailable的问题及解决

    这篇文章主要介绍了vue运行项目时network显示unavailable的问题及解决,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-09-09
  • element自定义 多文件上传 触发多次on-change问题

    element自定义 多文件上传 触发多次on-change问题

    这篇文章主要介绍了element自定义 多文件上传 触发多次on-change问题,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2023-03-03
  • 通过命令行创建vue项目的方法

    通过命令行创建vue项目的方法

    这篇文章主要介绍了通过命令创建vue项目的方法,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-07-07
  • element-ui中表格设置正确的排序及设置默认排序

    element-ui中表格设置正确的排序及设置默认排序

    表格中有时候会有排序的需求,下面这篇文章主要给大家介绍了关于element-ui中表格设置正确的排序及设置默认排序的相关资料,文中通过实例代码介绍的非常详细,需要的朋友可以参考下
    2023-05-05
  • UniApp在Vue3下使用setup语法糖创建和使用自定义组件的操作方法

    UniApp在Vue3下使用setup语法糖创建和使用自定义组件的操作方法

    通过defineProps定义属性,defineEmits定义事件,computed创建计算属性,emitEvent方法触发事件,在其他组件中导入并使用这些自定义组件,传递属性和监听事件,实现组件的复用性和可维护性,感兴趣的朋友跟随小编一起看看吧
    2024-11-11
  • Vue滑块验证码组件anji-captcha的使用案例详解

    Vue滑块验证码组件anji-captcha的使用案例详解

    滑块验证是一种常见的人机识别方法,这篇文章主要介绍了Vue滑块验证码组件anji-captcha的使用,本文通过实例代码图文相结合给大家介绍的非常详细,需要的朋友可以参考下
    2023-05-05
  • Vue.js中集成Socket.IO实现实时聊天功能

    Vue.js中集成Socket.IO实现实时聊天功能

    随着 Web 技术的发展,实时通信成为现代 Web 应用的重要组成部分,Socket.IO 是一个流行的库,支持及时、双向与基于事件的通信,适用于各种平台和设备,本文将介绍如何在 Vue.js 项目中集成 Socket.IO,实现一个简单的实时聊天应用,需要的朋友可以参考下
    2024-12-12
  • uniapp vue与nvue轮播图之轮播图组件的示例代码

    uniapp vue与nvue轮播图之轮播图组件的示例代码

    这篇文章主要介绍了uniapp vue与nvue轮播图轮播图组件的实例代码,代码简单易懂,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2021-12-12
  • vxe-table如何在单元格中渲染简单的饼图

    vxe-table如何在单元格中渲染简单的饼图

    这篇文章主要介绍了vxe-table如何在单元格中渲染简单的饼图,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-09-09

最新评论