基于 vue (基本上是它聽起來的樣子) 來構造 electron 應用程序的樣板代碼。
概要
該項目的目的,是為了要避免使用 vue 手動建立起 electron 應用程序。electron-vue 充分利用 vue-cli
作為腳手架工具,加上擁有 vue-loader
的 webpack
、electron-packager
或是 electron-builder
,以及一些最常用的插件,如vue-router
、vuex
等等。
在 這里 查看其文檔。
你會在本樣板代碼中找到的東西...
- 基本的項目結構與 單一的
package.json
設置 - 詳細的 文檔
- 使用 vue-cli 作為項目腳手架
- 立即可用的 Vue 插件 (axios, vue-electron, vue-router, vuex)*
- 預裝開發工具 vue-devtools 和 devtron
- 使用 electron-packager 或 electron-builder 輕松打包你的應用程序*
appveyor.yml
與.travis.yml
配置用于 electron-builder 的自動部署*- 能夠生成用于瀏覽器的網頁輸出
- 便利的 NPM 腳本
- 使用攜帶模塊熱更新 (Hot Module Replacement) 的 webpack 和 vue-loader
- 在工作在 electron 的
main
主進程時重啟進程 - 支持使用 vue-loader 的 HTML/CSS/JS 預處理器
- 默認支持
stage-0
的 ES6 - 使用
babili
避免完全反編譯到 ES5 - ESLint (支持
standard
和airbnb-base
)* - 單元測試 (使用 Karma + Mocha)*
- 端到端測試 (使用 Spectron + Mocha)*
* 在vue-cli
腳手架中可定制
起步
該樣板代碼被構建為 vue-cli
的一個模板,并且包含多個選項,可以自定義你最終的腳手架程序。本項目需要使用 node@^7
或更高版本。electron-vue 官方推薦 yarn
作為軟件包管理器,因為它可以更好地處理依賴關系,并可以使用 yarn clean
幫助減少最后構建文件的大小。
# 安裝 vue-cli 和 腳手架樣板代碼
npm install -g vue-cli
vue init simulatedgreg/electron-vue my-project
# 安裝依賴并運行你的程序
cd my-project
yarn # 或者 npm install
yarn run dev # 或者 npm run dev
你是一個 Windows 用戶?
請務必查看 Windows 用戶注意事項 來確保你擁有 electron 和其他依賴關系所需的所有必要構建工具。
希望使用 Vue 1?
只需指向 1.0
分支即可。請注意,electron-vue 已經正式廢除了 vue@^1
的使用,因此,這些更改也同樣會反映到項目結構、功能和文檔上 (遺留文檔)。
vue init simulatedgreg/electron-vue#1.0 my-project
下一步
請務必查看 這個文檔。在這里,你將找到有關項目配置、項目結構和構建應用程序的有用信息。這里還有一個方便的 常見問題 的部分。
基于 electron-vue 的作品
看看一些基于 electron-vue 建造的了不起的的項目。想要在此列出你自己的項目嗎?請隨時提交 pull 請求。
- Surfbird: 一個基于 Electron 和 Vue 的 Twitter 客戶端
- Lulumi-browser: Lulumi-browser 是一個輕量級的瀏覽器,基于 Vue.js 2 和 Electron
- Space-Snake: 使用 Electron 和 Vue.js 構建的桌面游戲。
- Forrest: 一個 npm 腳本的桌面客戶端
- miikun: 一個簡單的 Markdown 編輯器
- Dakika: 超省時的應用程序,使寫作變得輕而易舉
- Dynamoc: Dynamoc 是一個 dynamodb-local、 dynalite 和 AWS dynamodb 的圖形化界面客戶端
- Dockeron: Dockeron 項目, 基于 Electron + Vue.js 的 Docker 桌面客戶端
- Easysubs: 快速簡單地下載字幕
- Data-curator:分享可用的開放數據。