by chiflix

chiflix / splayerx
541 Stars 109 Forks Last release: 13 days ago (4.9.4) GNU General Public License v3.0 8.4K Commits 109 Releases

Available items

No Items, yet!

The developer of this repository has not created any items for sale yet. Need a bug fixed? Help with integration? A different license? Create a request here:


Dependencies Status devDependencies Status Build Status appveyor codecov Crowdin


目前架构的特点在 Electron 的基础上使用了 Vue.js MVVM组件化开发框架。

  • 开发中使用 webpack,运行
    npm run dev
    修改代码后可以同步至表现层,hot reload,不用重新启动。
  • 使用 eslint 控制代码质量,不满足标准的代码无法通过编译并会报错。
  • 每次版本提交会通过 travis-ci 和 appveyor 自动编译,如果不能通过编译会记录错误,且相应的 badge会变红色。
  • tag 一个新的commit时,CI 工具会自动打包发行版本,并放入 GitHub Releases
  • 使用 Karma 进行单元测试,codecov的badge codecov 会显示当前代码的测试覆盖率。
  • 使用 Global Event Bus 做消息通讯
  • 使用 vue-routervuex 用于跨组件数据交互。
  • 有可能导致阻塞的操作,例如IO读写或者CPU intensive tasks,应放在基于 electron-remote 创建的 separate process 里面。参考:Deep dive into Electron’s main and renderer processes
  • 可以用 CommandOrControl+Shift+I+O+P 打开开发工具,在 production 环境中也可以使用


  • 代码风格遵循 https://vuejs.org/v2/style-guide/ ,命名使用 PascalCase 风格
  • commit message 遵循 AngularJS Git Commit Message Conventions,提交需通过 CommitLint Online 检查。
  • 播放事件的生命周期: > 1. 通过Global Event Bus
    发出指令,例如 play、pause > 2. VideoCanvas 收到 event 之后,调用 DOM 的 function 控制 video 对象 > 3. video 对象的事件会绑定至 VideoCanvas 的 methods > 4. 消息中的状态数据通过 vuex commit 至
    中 > 5. 其他各 vue components 根据 data store 的数据状态更新表现层
  • video-controller 之下的 child components 需要响应 click 事件时注意使用
    以保证先于 video-controller 触发点击事件并避免事件穿透
  • 代码引用文件时使用
    [email protected]/
    src="[email protected]/assets/"
  • 字体文件放在fonts目录下,css|scss文件放在css目录下
  • 使用 vue-i18n 做多语言支持
  • 优先使用CSS来制作动态效果

Branching Model

  • http://nvie.com/posts/a-successful-git-branching-model/


# install dependencies
npm install

serve with hot reload at localhost:9080

npm run dev

build electron application for production

npm run build

run unit test

npm run unit

lint all JS/Vue component files in src/

npm run lint



- CSCLINK and CSCKEYPASSWORD from https://www.electron.build/code-signing/ - GHTOKEN= https://help.github.com/articles/creating-a-personal-access-token-for-the-command-line/

Maintainance Cheetsheet

clear up AppVeyor Cache

curl -H "Authorization: Bearer $APPVEYOR_TOKEN" -H "Content-Type: application/json" -X "DELETE" \ https://ci.appveyor.com/api/projects/tomasen/splayerx-susim/buildcache

This project was generated with electron-vue@7c4e3e9 using vue-cli. Documentation about the original structure can be found here.

We use cookies. If you continue to browse the site, you agree to the use of cookies. For more information on our use of cookies please see our Privacy Policy.