Electron-vue实战-每日清单---02Electron-vue的目录详解

简介: Electron-vue实战-每日清单---02Electron-vue的目录详解

项目地址,欢迎批评指正,随手Star哟
  1. Electron-vue实战-每日清单—01Electron-vue的使用
  2. Electron-vue实战-每日清单—02Electron-vue的目录详解
  3. Electron-vue实战-每日清单—03功能介绍与环境搭建

my-project

├─ .electron-vue

│ └─ build.js

打包时调用,在package.json中的script里的build命令

“build”: “node .electron-vue/build.js && electron-builder”,

│ └─ dev-client.js

│ └─ dev-runner.js

运行时的配置

│ └─ webpack.main.config.js

针对 electron 的 main 进程

│ └─ webpack.renderer.config.js

针对 electron 的 renderer 进程

│ └─ webpack.web.config.js

针对为浏览器构建你的 renderer 进程的源代码

│ └─ icons/

├─ dist

打包之后的目录

│ ├─ electron/

│ └─ web/

├─ node_modules/

项目所需的依赖

├─ src

│ ├─ main

主进程目录

│ │ ├─ index.dev.js

会安装加载vue-devtools

│ │ └─ index.js

main进程的主要方法都在这里写

│ ├─ renderer

渲染进程,也就是vue所在

│ │ ├─ components/

定义vue组件

│ │ ├─ router/

vue-router的路由

│ │ ├─ store/

vuex

│ │ ├─ App.vue

│ │ └─ main.js

vue中的main.js

│ └─ index.ejs

相当于index.html ,因为webpack会将他打包成index.html

├─ static/

静态资源

├─ test

│ ├─ e2e

│ │ ├─ specs/

│ │ ├─ index.js

│ │ └─ utils.js

│ ├─ unit

│ │ ├─ specs/

│ │ ├─ index.js

│ │ └─ karma.config.js

│ └─ .eslintrc

├─ .babelrc

├─ .eslintignore

├─ .eslintrc.js

eslint的配置文件,如果你使用eslint的会自动生成他

├─ .gitignore

配置上传git忽略的文件

├─ package.json

定义了这个项目所需要的各种模块,以及项目的配置信息(比如名称、版本、许可证等元数据)

└─ README.md

执行npm run dev或 yarn dev 会现在package.json中找到

“dev”: “node .electron-vue/dev-runner.js”,

执行命令会先找到 .electron-vue/dev-runner.js 这个js中 的 startMain()函数会找到…/src/main/index.dev.js,

而在这个js中会require(’./index’),会找到同级目录下的jndex.js 从而创建窗口


相关文章
|
人工智能 自然语言处理 JavaScript
通义灵码2.5实战评测:Vue.js贪吃蛇游戏一键生成
通义灵码基于自然语言需求,快速生成完整Vue组件。例如,用Vue 2和JavaScript实现贪吃蛇游戏:包含键盘控制、得分系统、游戏结束判定与Canvas动态渲染。AI生成的代码符合规范,支持响应式数据与事件监听,还能进阶优化(如增加启停按钮、速度随分数提升)。传统需1小时的工作量,使用通义灵码仅10分钟完成,大幅提升开发效率。操作简单:安装插件、输入需求、运行项目即可实现功能。
630 4
 通义灵码2.5实战评测:Vue.js贪吃蛇游戏一键生成
|
JavaScript API 容器
Vue 3 中的 nextTick 使用详解与实战案例
Vue 3 中的 nextTick 使用详解与实战案例 在 Vue 3 的日常开发中,我们经常需要在数据变化后等待 DOM 更新完成再执行某些操作。此时,nextTick 就成了一个不可或缺的工具。本文将介绍 nextTick 的基本用法,并通过三个实战案例,展示它在表单验证、弹窗动画、自动聚焦等场景中的实际应用。
1234 17
|
存储 JavaScript 前端开发
前端开发:Vue.js入门与实战
【10月更文挑战第9天】前端开发:Vue.js入门与实战
|
JavaScript 前端开发
Vue开发必备:$nextTick方法的理解与实战场景
Vue开发必备:$nextTick方法的理解与实战场景
1263 1
Electron——electron-vue使用webworker
Electron——electron-vue使用webworker
425 4
|
JavaScript UED
"Vue实战技巧大揭秘:一招解决路由跳转页面不回顶部难题,让你的单页面应用用户体验飙升!"
【10月更文挑战第23天】在Vue单页面应用中,点击路由跳转时,默认情况下页面不会自动滚动到顶部,这可能影响用户体验。本文通过一个新闻网站的案例,介绍了如何使用Vue-router的全局前置守卫和`scrollBehavior`方法,实现路由跳转时页面自动滚动到顶部的功能,提升用户浏览体验。
802 0
|
JavaScript 前端开发 开发者
Vue学习之--------深入理解Vuex、原理详解、实战应用(2022/9/1)
这篇文章详细介绍了Vuex的基本概念、使用场景、安装配置、基本用法、实际应用案例以及注意事项,通过一个数字累加器的实战示例,帮助开发者深入理解Vuex的原理和应用。
|
JavaScript
Vue中组件化编码使用(实战练习一)
这篇文章是关于Vue中组件化编码的实战练习,介绍了组件化编码的流程、组件间参数传递的方法以及如何通过组件配合完成一个需求。内容包括了组件拆分、动态组件实现、交互绑定事件的步骤,以及使用props进行父子组件通信的注意事项。文章还提供了一个待办事项列表的静态页面效果和相关代码示例,包括TheFooter.vue、TheHeader.vue、TheItem.vue、TheList.vue和App.vue等组件的代码。
Vue中组件化编码使用(实战练习一)
|
JavaScript
Vue路由传参实战指南:三种常用方法示例演示
Vue路由传参实战指南:三种常用方法示例演示
1049 0

热门文章

最新文章