Loading [MathJax]/jax/output/CommonHTML/config.js

开发者社区

文档建议反馈控制台

文章/答案/技术大牛

发布

社区首页 >专栏 >electron开发app

electron开发app

sofu456

发布于 2019-07-09 06:13:07

发布于 2019-07-09 06:13:07

2.2K00

代码可运行

举报

文章被收录于专栏：sofu456sofu456

运行总次数：0

代码可运行

新建electron项目

npm init 后填写项目基本信息生成package.json文件

package.json中

“main"指定文件"main.js”,
“script"制定"start"为"electron .”------->npm run start

index.html文件

<html>
    <head></head>
    <body></body>
</html>

main.js文件

var electron = require('electron')
var app = electron.app
app.on("ready",()=>{
    win = new electron.BrowserWindow({width:"800",height:"600"})
    win.loadURL("index.html")
})

package.json中添加依赖库

npm install 模块名称 --save 或者 --save-dev –save是对生产环境所需依赖的声明(开发应用中使用的框架，库) –save-dev是开发环境所需依赖比如：jq，react，vue都需要放到这里面 –save-dev是对开发环境所需依赖的声明(构建工具，测试工具) 比如：babel，webpack，都放到当前目录

vscode调试配置

addconfiguration添加nodejs electron main配置

配置vue.js

npm install -g vue-cli安装vue命令行 vue init webpack 项目名称初始化vue配置

本文参与腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。

原始发表：2018年12月05日，如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自作者个人站点/博客前往查看

如有侵权，请联系 cloudcommunity@tencent.com 删除。

本文参与腾讯云自媒体同步曝光计划，欢迎热爱写作的你一起参与！

评论

登录后参与评论

暂无评论

编辑精选文章

换一批

万字详解高可用架构设计

Go 开发者必备：Protocol Buffers 入门指南

10分钟带你彻底搞懂分布式链路跟踪

多租户的 4 种常用方案

亿级月活的社交 APP，陌陌如何做到 3 分钟定位故障？

60页PPT全解：DeepSeek系列论文技术要点整理

Electron 使用 Webpack2 打包应用程序

前两天看了一下使用 Electron 开发应用程序，今天说说所怎样集成 Electron 和 Webpack2 来打包应用程序。安装依赖库这里准备做个小的演示程序，首先安装一些这个演示程序需要看的第三方库 $ npm install --save-dev electron $ npm install --save-dev electron-packager $ npm install --save-dev webpack $ npm install --save-dev webpack-dev-se

kongxx

2018/05/14

1.1K0

Electron 使用 Webpack2 预编译 Electron 和 Browser targets

electron webpack json javascript 打包

前一篇文章说了说怎样使用 Webpack2 预编译 Electron 应用，但是有时候我们希望使用 Webpack2 的热部署功能来提高我们的开发效率，使我们在代码修改后能自动立即看到修改后的结果。那么今天就看看怎样来实现这个功能。安装依赖库 $ npm install --save-dev electron $ npm install --save-dev electron-packager $ npm install --save-dev webpack $ npm install --save-

kongxx

2018/05/14

1.1K0

Electron快速上手并将网站直接生成桌面应用

electron node.js html css flutter

Atom、Postman、Notion、Vscode等都是用Electron开发的

游魂

2021/11/24

2.8K1

Electron快速上手并将网站直接生成桌面应用

electron+vue建立桌面级应用入门这一篇文章就够了

vue.js json node.js javascript electron

写这篇文章的时候已经是深夜十二点了，但是还是想写下来，因为我这个人有个毛病，就是当我发现一个新的好用的东西的时候常常会激动的睡不着觉，不记录下来根本睡不着，而且程序员晚睡不应该是标配吗？废话说了几句，说一下今天的主角，electron

何处锦绣不灰堆

2020/05/29

1.1K0

Electron 使用 Webpack2 打包多入口应用程序

npm 人工智能

接前面一篇文章，前一篇文章中只有一个页面，并且只有一个js文件，所以打包的时候会把那个js打包成一个bundle.js文件。但是假如我们有多个页面，且每个页面需要使用的js文件也不同，那么我们应该怎样打包呢。安装依赖库这里准备做个小的演示程序，首先安装一些这个演示程序需要看的第三方库 $ npm install --save-dev electron $ npm install --save-dev electron-packager $ npm install --save-dev webpack $

kongxx

2018/05/14

1.2K0

Electron 跨平台应用开发的终极技能

打包 electron 开发跨平台前端

各位朋友，是否想打造一款属于自己的桌面程序？昨天分享了炫酷的前端开源项目edex UI终端模拟器，里面就是用的electron来打包编译windows桌面程序。之前刚毕业那会有过开发windows应用的经历，不过是用C#的winform开发一点简单的应用，后面就没有然后了，代码类似如下：

希里安

2023/10/30

4280

Electron 跨平台应用开发的终极技能

2.4 电脑/手机客户端开发简介

javascript electron node.js 打包 html5

想开发手机app？不会开发PC客户端？不存在！会写网页几步就能实现将网页转化为PC或手机客户端。

周星星9527

2018/08/07

2.4K0

2.4 电脑/手机客户端开发简介

使用Electron开发桌面应用

electron javascript 渲染开源 html

摘要总结。该文介绍了如何使用Electron框架开发桌面应用。Electron是一个用于构建跨平台桌面应用的框架。通过使用Electron，开发者可以使用JavaScript、HTML和CSS来构建桌面应用。Electron应用包括三个主要组件：package.json文件、index.html文件以及main.js或renderer.js文件。使用Electron开发应用时，可以通过Electron的API与主进程和渲染进程进行交互。Electron应用可以运行在Mac、Windows和Linux上。

用户1141560

2017/12/26

2.6K0

使用Electron开发桌面应用

Electron 创建桌面应用

添加淘宝 NPM 镜像啥都不说了，干活前先添加淘宝 NPM 镜像，不然后面安装模块的时候会卡住。 $ sudo npm install -g cnpm --registry=https://registry.npm.taobao.org 安装 electron 这里我是使用的全局 $ sudo cnpm install -g electron 创建应用一个 Electron 应用的目录结构大致如下： myapp/ ├── package.json ├── main.js └── index.html p

kongxx

2018/05/14

1.5K0

AntDesignPro使用electron构建桌面应用

打包 javascript electron node.js npm

当项目打包成应用后使用的是 file:协议 ant pro 的请求无法发出需要使用完整的请求地址目前方法为配置前缀

憧憬博客

2020/08/12

2.4K0

Electron集成Vue Cli3创建项目

electron vue.js 视频处理打包 webpack

插件官网地址： https://nklayman.github.io/vue-cli-plugin-electron-builder/

码客说

2020/05/09

2.6K0

electron-tabs 打包方法

javascript 打包 electron git npm

最近公司项目需求涉及到 electron 应用的标签页实现，所以找到了这个开源的页签实现方式。

薛定喵君

2022/08/30

1.1K0

Electron入门教程1 —— 编写第一个桌面应用程序

javascript electron node.js 打包 windows

关于Electron这个框架我就不多介绍，它说白了就是Node和Chromium内核的一种封装。用它开发出来的桌面应用程序其实就是套壳浏览器的应用，这就是为什么它可以用web前端技术来开发，并且可以跨平台的原因了。

害恶细君

2022/11/22

6.7K0

Electron入门教程1 —— 编写第一个桌面应用程序

webpack + react + ts + semiDesign +electron

webpack 打包 yarn node.js react

yarn add -D webpack webpack-cli 或者npm install -D webpack webpack-cli

用户4793865

2023/01/12

2.3K0

webpack + react + ts + semiDesign +electron

Electron桌面应用打包流程（记录一下）

javascript 微信企业 npm node.js

参考链接：http://www.runoob.com/nodejs/nodejs-install-setup.html

力力

2019/08/26

6K0

Electron桌面应用打包流程（记录一下）

程序员就得会偷懒，重写了一个electron小工具，解放美女运营！

electron 前端腾讯技术创作特训营S10 node.js

文章地址：https://cloud.tencent.com/developer/article/2474320

一起重学前端

2024/12/06

1640

1-Electron基础

渲染 electron npm ip 进程

由于Electron基于Chromium架构，所以自然而然遵循其多进程架构，一个完整的Electron应用包含多个进程，这些进程被分为主进程与渲染进程

Ywrby

2022/10/27

5670

使用Electron创建跨平台桌面应用

electron api javascript 打包 html

开发和维护一个桌面应用是比较复杂的，所以可以理解现在的公司门为何推动WEB应用或者各种跨平台版本，在过去的十几年里，已经有了很多尝试，Flash、Air、Java和Sliverlight，他们都各自取得了不同程度的成功

疯狂的技术宅

2019/03/27

1.6K0

使用Electron创建跨平台桌面应用

React使用Electron开发桌面端

react 打包 electron 开发终端

React是一个流行的JavaScript库，用于构建Web应用程序。结合Electron框架，可以轻松地将React应用程序打包为桌面应用程序。以下是使用React和Electron开发桌面应用程序的步骤：

世间万物皆对象

2024/03/20

7970

electron套壳vue2项目

electron vue.js

最近lender提了个需求，说最近项目可能要变动一下，把网页端变成桌面端，小手一挥，博主就开始库库的找。奈何网上教程一大堆，但是没找到一个对版的，不是安装过程有错，就是执行命令过程失误。一个教程文章得搜五个报错文章，虽然最终我做出来噜，但是很费劲，所以这篇用来总结一下。

刘小胖

2024/04/10

5132

electron套壳vue2项目

相关推荐

Electron 使用 Webpack2 打包应用程序

更多 >

LV.1

研发

作者相关精选

目录

新建electron项目

package.json中添加依赖库

vscode调试配置

配置vue.js

加入讨论

的问答专区 >

小明互联网技术分享社区0

1Java工程师擅长4个领域

相关课程

一站式学习中心 >

腾讯云WeData大数据开发与治理训练营

数据开发治理平台 WeData

Python教程-Django框架快速入门到实战

TDSQL for MySQL训练营

云数据库 MySQL

TDSQL MySQL 版

分布式数据库 TDSQL

本文部分代码块支持一键运行，欢迎体验

本文部分代码块支持一键运行，欢迎体验