Electron-Vue之安装流程

最新推荐文章于 2024-06-27 21:14:08 发布
最新推荐文章于 2024-06-27 21:14:08 发布
阅读量5.1k 收藏 8
点赞数 2
分类专栏： Electron nodejs vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/FussyCat/article/details/89406860
版权
本文介绍了在Windows系统上使用Electron-Vue开发桌面应用的详细安装流程，包括node.js和npm的安装，淘宝镜像的使用，electron、vue的安装，创建项目及下载依赖。在安装过程中遇到的网络问题，如npm下载失败，通过配置淘宝镜像或升级npm解决了Error [ERR_STREAM_WRITE_AFTER_END]的错误。
摘要由CSDN通过智能技术生成

近期摒弃了熟悉的WPF，选用了新的一套工具（Electron-Vue）来开发桌面软件。（我是连html都没用过的猿，^no zuo no die^）。
接触新的东西，往往都碰到不少问题，记录下踩过的坑，以及正确姿势该如何打开，为猿类们提供借鉴。

下面介绍下正确的Electron-Vue安装流程：

《目录》

  1. 安装流程
    1.1. node.js和npm安装
    1.2. 淘宝镜像安装
    1.3. electron安装
    1.4. vue安装
    1.5. 创建脚手架
    1.6. 下载依赖文件
    1.7. 运行项目
  2. 问题解决
    2.1. 问题描述
    2.2. 解决方案
1.安装流程

以下是基于windows-64系统上进行安装。

1.1.node.js和npm安装

安装包下载官网：https://nodejs.cn/download/，选择最新的长期支持版本下载即可。
在这里插入图片描述
安装node时，一直选择默认的即可。如果要更改安装路径，安装完成后，记得更改系统变量的path。
在安装node的时候，n

最低0.47元/天 解锁文章
FussyCat
关注
  • 2
    点赞
  • 踩
  • 8
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
electron-vue开发，介绍
嚜溟的博客
08-13 6399
开发 开始开发环境设置 在你使用yarn 或者npm install 安装依赖之后，运行..... yarn run dev # (yarn run dev) 或者 npm run dev 此样板代码附带了几个易于移除的登录页面组件。   入口 在产品阶段，electron-vue 使用 html-webpack-plugin 创建 index.html。在开发过程中，你将在 s...
Electron-vue 成功打包全流程
mm_0123456789的博客
02-09 4789
electron-vue打包 仅适用于windows系统 文章目录electron-vue打包前言一、打包流程1. 安装electron自带打包插件2. 修改package.json文件3. 执行打包命令二、遇到的错误及解决方案1. electron包下载错误2. WinCodeSign下载3. nsis相关下载4. 再次执行打包操作4. 本地安装总结 前言 一、打包流程 1. 安装electron自带打包插件 代码如下（示例）： npm install electron-builder 2. 修改p
第2章：Electron的安装与配置
一名全栈开发工程师
06-27 1012
本文介绍了Electron的安装和配置
electron-vue搭建流程
ABC_efg123456的博客
04-09 1622
electron能开发桌面应用，与Vue很好结合 npm install --global @vue/cli vue create electronjs的官方地址 https://www.electronjs.org/ electron-vue的官方文档地址 https://simulatedgreg.gitbooks.io/electron-vue/content/cn/?q= 创建项目 vue init simulatedgreg/electron-vue my-project 进入项目目录 cd
用 Electron + Vue 打造跨平台应用：探索 `electron-vue-template`
gitblog_00045的博客
04-19 330
用 Electron + Vue 打造跨平台应用：探索 electron-vue-template 项目地址:https://gitcode.com/Deluze/electron-vue-template 在开发桌面应用时，Electron 和 Vue.js 的组合成为了许多开发者的选择。electron-vue-template 是一个基于这两项技术的模板项目，旨在帮助开发者快速启动他们的跨平...
Electron学习2 使用Electron-vue和Vuetify UI库
编程圈子-谢厂节的博客
08-22 1192
Electron-Vue 是一个使用 Vue.js 构建跨平台桌面应用程序的框架。它基于 Electron，一个使用 JavaScript、HTML 和 CSS 构建跨平台桌面应用程序的开源库。Electron-Vue 结合了 Vue.js 的灵活性和 Electron 的跨平台能力，使得开发桌面应用程序变得更加简单和高效。使用 Vue.js 构建应用程序：Electron-Vue 提供了基于 Vue.js 的开发体验，你可以使用 Vue.js 的语法和组件系统来构建桌面应用程序。
electron-vue编译
blue_sky的博客
03-18 2633
electron打包在官网给了三种方式，分别是electron-packager、electron-builder、electron-forge 1. electron-packager主要打包成可执行文件 2. electron-builder主要是是打包成安装文件（推荐这种方式比较友好） 3. electron-forge笔者用的较少 一、首先先上一个官方文档地址 1...
electron-vue的原理以及初次使用流程
qq_40261735的博客
05-26 1278
这里写目录标题electron-vue介绍electron项目结构electron运行过程electron-vue初次使用过程 electron-vue介绍 electron项目结构 electron运行过程 electron-vue初次使用过程
electron-vue架构解析3-开发环境启动流程分析（原）
阿杜的专栏
06-11 7269
这一节我们来看开发环境的启动流程。 该框架主要修改是对开发环境的优化，包括了于开发环境的配置文件隔离，主进程和渲染进程配置文件隔离，编译过程提示等功能，因此这一节内容才是整个框架的核心。 我们从开发人员用到的启动命令说起。 从package中我们看到启动命令就是： "dev": "node .electron-vue/dev-runner.js", 也就是在终端使用npm run dev...
electron-vue项目搭建-router自动化模块
小dobby
04-13 2256
electron-vue项目搭建-router自动化模块前言路由生成规则router文件实现main.js 挂载路由文件页面demo 前言 之前使用vue-ts生成了基础项目，后来改用了vue-js，流程方法基本是一样的，参考连接： https://blog.csdn.net/qq_39664702/article/details/124046966 路由生成规则 1. 所有页面 vue 文件，需要全部放在@/src/views 中 2. 页面 vue 文件命名规则统一使用`kebab-case` 小写
Electron项目中通过electron-vue + electron-builder + electron-updater实现远程更新（包含源码）
04-01
本项目利用`electron-vue`、`electron-builder`和`electron-updater`这三款强大的工具，实现了一个完整的远程更新流程，包括检查更新、下载更新以及自动安装更新。以下将详细介绍这三个组件的功能和实现方式。 **1....
electron-vue打包流程.md
05-19
electron还是麻烦啊，看了很久的文章，总结打包流程
基于 electron-vue 开发的音乐播放器，界面模仿QQ音乐，技术栈electron-vue+vue+vuex+vue-r
05-25
Electron 允许开发者使用 JavaScript、HTML 和 CSS 创建跨平台的桌面应用，而 electron-vue 提供了一套完整的开发环境和构建流程，使得 Vue.js 开发者能够快速上手 Electron。 **Vue.js** 是一种流行的轻量级前端...
electron-vue项目示例
07-04
** Electron-Vue 项目概述** `Electron-Vue` 是一个基于 `Electron` 和 `Vue.js` 的桌面应用开发框架。它结合了 `Electron` 的桌面应用程序能力与 `Vue.js` 的前端开发便利性，让开发者可以利用 Vue 的生态系统来...
electron-vue.zip
08-12
本文将深入探讨 Electron Vue 的核心概念、安装流程以及相关工具 winCodeSign 和 nsis 的使用。 Electron Vue 是基于 Vue.js 和 Electron 的集成开发环境，它为开发者提供了 Vue CLI 的所有优点，同时简化了 ...
pillow_heif-0.17.0-pp39-pypy39_pp73-macosx_14_0_arm64.whl
07-27
基本介绍 名称与起源：Pillow，原名为PIL（Python Imaging Library），但PIL只支持Python 2版本。随着Python 3的普及，Pillow作为PIL的一个分支出现，兼容Python 3并提供更多的功能和改进。 主要功能：Pillow支持多种图像格式的打开、保存、显示以及基本的图像操作和处理，如裁剪、缩放、旋转、翻转、滤镜应用等。 跨平台性：Pillow库可以在不同的操作系统上运行，包括Windows、Linux和MacOS等。 主要功能模块 Pillow库包含多个功能模块，每个模块都提供了特定的图像处理功能。以下是一些常用的模块： Image：用于处理图像文件，提供打开、保存、调整大小、旋转、裁剪、滤镜等功能。 ImageDraw：提供在图像上绘制各种形状（如线条、矩形、圆形）和文本的功能。 ImageFont：用于加载和使用TrueType字体文件，以便在图像上绘制文本时设置字体样式、大小和颜色。 ImageFilter：提供各种滤镜效果，如模糊、锐化、边缘增强等，用于图像增强、特效处理和图像识别等应用。 ImageEnhance：用于调整图像的亮度、对比度、颜色饱和度等参数，使图像更加清晰、明亮或具有特定的调色效果。 高级功能 除了基本的图像处理功能外，Pillow还支持一些高级功能，如色彩空间转换、直方图均衡化等。这些功能可以帮助用户进行更复杂的图像处理和分析。
cykooz.resizer-3.0.0-cp310-cp310-macosx_11_0_arm64.whl
07-27
python库，可以直接安装使用，再也不怕自己pip下载，出现等待超时的现象。欢迎下载使用，使用过程中如有使用问题，请及时与我沟通交流，帮你解决！ python库，可以直接安装使用，再也不怕自己pip下载，出现等待超时的现象。欢迎下载使用，使用过程中如有使用问题，请及时与我沟通交流，帮你解决！ python库，可以直接安装使用，再也不怕自己pip下载，出现等待超时的现象。欢迎下载使用，使用过程中如有使用问题，请及时与我沟通交流，帮你解决！ python库，可以直接安装使用，再也不怕自己pip下载，出现等待超时的现象。欢迎下载使用，使用过程中如有使用问题，请及时与我沟通交流，帮你解决！ python库，可以直接安装使用，再也不怕自己pip下载，出现等待超时的现象。欢迎下载使用，使用过程中如有使用问题，请及时与我沟通交流，帮你解决！
[毕设]Delphi题库管理与试卷自动生成系统.zip
最新发布
07-27
[毕设]Delphi题库管理与试卷自动生成系统
使用electron-vue搭建项目
03-28
1. 安装vue-cli和electron ```bash npm install -g vue-cli npm install -g electron ``` 2. 创建项目 ```bash vue init simulatedgreg/electron-vue my-project ``` 3. 安装依赖 ```bash cd my-project npm install ``` 4. 启动开发服务器 ```bash npm run dev ``` 5. 打包应用 ```bash npm run build ``` 6. 运行应用 ```bash npm run start ``` 以上就是使用electron-vue搭建项目的基本流程，可以根据实际需要进行修改和优化。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值