electron桌面应用开发(七)-electron-vue基本概念

2019-10-15 15:53:04 浏览数 (1)

本文目录:

前言目录结构参考一番今日

前言

今天想继续写electron,在准备素材做实验的时候,发现基本概念太薄弱了,对工程的目录作用和基本运行逻辑都不是很熟,导致做起实验举步维艰,所以还是需要加强下基础知识。所以这里学学electron-vue的基础知识,首先认识下工程目录构成。

目录结构

  • 开发主进程src/main/index.dev.js,开发主进程入口。该文件专门用于开发和安装开发工具。最后跳转到src/main/index.js
  • 开发状态和产品状态:我们所看到的所有目录在最终产品构建的时候只有dist、node_modules和package.json这几个文件夹和文件,其他的目录和文件只存在于开发过程中。
  • 渲染器进程(renderer目录):Electron 中的每个网页都在自己的进程中运行,称为渲染器进程 (renderer process)。
  • vue 组件:renderer/components目录,创建子组件时,一个常用的组织化实践是将它们放置在一个使用其父组件名称的新文件夹中。
  • vue路由:鼓励使用 vue-router创建 单页应用程序 。
  • vuex模块:electron-vue 利用 vuex 的模块结构创建多个数据存储,并保存在 src/renderer/store/modules 中。
  • 主进程:electron实际是以package.json这个脚本为入口的,运行的这个脚本其实就是主进程。
  • 三个变量:__dirname,__filename__static
  • Webpack 配置.electron-vue文件夹便是存放Webpack配置文件的。里面有专门针对main和rederer的配置。

参考

  • electron-vue文档:

https://simulatedgreg.gitbooks.io/electron-vue/content/cn/

0 人点赞