electron-vue 开发(一)——Hello World

electron-vue 开发(一)——Hello World

☞☞electron-vue 开发(一)——Hello World
☞☞electron-vue 开发(二)——主进程和渲染进程通信
☞☞electron-vue 开发(三)——点击提交按钮创建子窗口


前提:安装了 npm、node

提供一个写的不错的一篇文章:走你┏ (゜ω゜)=☞

我个人喜欢用另一种更快的方式,接下就开始。

要先安装 npm install electron --save-dev

1. 安装 vue-cli

cnpm install -g vue-cli 或者是 npm install -g vue-cli 都可以。

2. 安装脚手架样板代码

vue init simulatedgreg/electron-vue my-project(my-project是项目的名称,可以修改)

有的时候命令执行的太慢,推荐以下方式安装:

2.1、将electron-vue项目先下载下来

electron-vue国内码云地址,直接下载到本地。
或通过git直接克隆到本地 git clone https://gitee.com/mirrors/electron-vue.git

2.2 安装样板代码

F:\privateProjects\workspace\project\Elc\ele-vue\electron-vue 是下载下来后的项目路径(根 据 自 己 下 载 的 位 置 自 行 调 整),my-project 是项目名称。
之后根据如下代码,即可快速构建项目模板。

vue init F:\privateProjects\workspace\project\Elc\ele-vue\electron-vue my-project
在这里插入图片描述

3.运行项目

cd demo

npm install

npm run dev

在这里插入图片描述
你会发现报错了,那么不要慌,让我们改一下配置:
请看这篇文章:安装electron-vue遇到的问题
修改之后就可以看到这样的效果

在这里插入图片描述

4. Hello World

修改一下页面,我们的hello World 就出来了~~~

在这里插入图片描述
在这里插入图片描述

  • 0
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值