Dean’ s Message · 二、案例教学+名企实践培养应用型人才 在教学上采用案例教学及项目实操相结合的方式,培 养应用型人才。拥有腾讯、ibm
Electron Vue的桌面应用开发实践 -...
Transcript of Electron Vue的桌面应用开发实践 -...
-
Electron Vue
-
@-
-
-
02
01
04Electron Vue03
-
CRUD
SDK
-
SDK
DevOpsH5PC
-
IO
Web
GUI)
-
02
01
0403 Electron Vue
-
Chromium
Native
C++/C#/C+(Windows)
Objective-C/Swift(Mac)
Qt: (Windows/Mac)
NW.js/Electron(Windows/Mac)
Native
-
Electron
VS Code POSTMAN
-
02
01
0403 Electron Vue
-
Electron
Main-process Render-process
-
BrowserWindow
BrowserWindow BrowserWindow
1 2
IDE, IM
1 2
Vuex
Render Process
Main Process
Render Process
Main Process
IPCRPC
Render Process
IPC RPC
IPC
-
Bridge Node API Native API
Eggjs
Cat
Egg-cors Egg-Script
Vue Vue-Router Vuex Iview
Electron Main ProcessRender Process
SSO Stash
Electron-builder webpack Gulp etc
UAC
-
bin jenkins.sh run-test.sh tasks gulp.dev.js gulp.prod.js conf gulpfile.babel.js webpack.dev.conf.js webpack.prod.conf.js postcss.config.js src components pages store router styles App.vue index.js package.json
bin jenkins.sh upload.sh tasks gulp.dev.js gulp.prod.js release.js conf webpack.renderer.conf.js webpack.main.conf.js release.conf.js src main index.js utils.js renderer components pages store router App.vue index.js package.json
Electron SWA Web SPA
-
Electron
-
Restart
webpack DevServer
htttp://localhost
Electron Main Process
webApp (Vue)
1hotReload
2
2
watch-runwebpack
3
Render Process file://static file
1 3 4
-
App
vue-devtools
Electron inspect
Debugchrome://inspect/#devices
v8 Inspector
Node
WSChrome DevTools
STDIO
Electron
Chrome DevTools Protocol
-
webpack Static fileTarget Electron-Build
Mac
Linux
Window building main process building renderer process code signing building target=electron-demo-X.X.X.dmg
Electron-Main Electron-Renderer
Vue
CDN
Static File
Web Native
ElectronwebApp
-
Git
Upload CDN
Electron Build
Code signing
Jenkins Job
Web-Hook
Electron Build
Code signing
Unit Testing
-
Electron
-
#1
Node Path file
Stream
Nativedialog Shell
TouchBar
Electron
Vue Component
NodeAPI NativeAPI
Vue Component
NodeAPI NativeAPI
bridge
bad case good case
-
#2
Index Page
http Login page
http SSO Center
Tiler callback Page
Cookie
Electron
FileHTTP
App ->registerStandardSchemes tiler://index.html http:// SSO proxy
RFC3986
-
#3
IPCMain
IPCRender
SendOn
AutoUpdater
setFeedURL()
checkForUpdates
update-downloaded
quitAndInstall()
Squirrel.Server
Squirrel.Mac
APP
electron-osx-sign electron-builder
-
#3
1.0
1.2
1.3
bug
SDK
-
#3
-
#4
Main Process
Render Process
Clinet Server
CrashReporter
Crash Log
Crashed
Crash
IM
Crash SDK
-
#4
-
02
01
0403 Electron Vue
-
ElectronWebWeb
Electron
html CSS JS Node.js OS API
html CSS JS
Mac / Window / Linux Nginx / CDN
Crash
DOM
-
Electron
\
devtronVue-devtools Electron inspect
ESLint
webpack
DevOps
Electron-build
Spectron + Mocha
SDK
Electron
babel
Node RunTime Native API
SDK SDK SDK SDK
Vuex Vue-Router UI Vue
-
Electron
master
release-branch
bugfix-branch
dev-branch release-branch
master release-branch
dev-branch
CDN
release-prod
API
run release:prod run release:dev
run dev run prod
RD2
RD1
PR
PR
web-hook
PR
PR
release-branch Jenkinsrelease-dev
-
z416043658