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项目搭建内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • Vue3 Element Plus表单自定义校验的实现全过程

    Vue3 Element Plus表单自定义校验的实现全过程

    这篇文章主要介绍了Vue3 Element Plus表单自定义校验的实现全过程,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
    2025-04-04
  • Element UI Dialog对话框改成固定高度超出部分滚动条滚动

    Element UI Dialog对话框改成固定高度超出部分滚动条滚动

    这篇文章主要给大家介绍了关于Element UI Dialog对话框改成固定高度超出部分滚动条滚动的相关资料,el-dialog默认高度是自由拉伸的,当内容超过屏幕时会出现滚动条,按钮和标题都会随着滚动,用户体验不好,需要的朋友可以参考下
    2024-05-05
  • vue 实现可拖曳的树状结构图

    vue 实现可拖曳的树状结构图

    这篇文章主要介绍了vue 实现可拖曳的树状结构图,帮助大家更好的理解和学习使用vue框架,感兴趣的朋友可以了解下
    2021-04-04
  • vue实现自定义多选按钮

    vue实现自定义多选按钮

    这篇文章主要为大家详细介绍了vue实现自定义多选按钮,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-07-07
  • vue中保留字符串中的空格完美解决方案

    vue中保留字符串中的空格完美解决方案

    这篇文章主要介绍了vue中保留字符串中的空格的解决方案,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2023-06-06
  • Vue事件总线怎么用

    Vue事件总线怎么用

    这篇文章主要介绍了Vue事件总线的使用方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
    2025-04-04
  • 非常实用的vue导航钩子

    非常实用的vue导航钩子

    这篇文章主要为大家分享了一个非常实用的vue导航钩子,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-03-03
  • 对Vue.js之事件的绑定(v-on: 或者 @ )详解

    对Vue.js之事件的绑定(v-on: 或者 @ )详解

    今天小编就为大家分享一篇对Vue.js之事件的绑定(v-on: 或者 @ )详解,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2018-09-09
  • 10分钟带你上手Vue3中新增的API

    10分钟带你上手Vue3中新增的API

    这篇文章主要介绍了10分钟教你快速上手Vue3中新增的API,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2022-09-09
  • 在antd4.0中Form使用initialValue操作

    在antd4.0中Form使用initialValue操作

    这篇文章主要介绍了在antd4.0中Form使用initialValue操作,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2020-11-11

最新评论