feat: electron supported

master
kunkka 4 years ago
parent 0d5738d60a
commit e60caf9018

3
.gitignore vendored

@ -24,3 +24,6 @@ pnpm-debug.log*
*.sw?
.vercel
#Electron-builder output
/dist_electron

@ -0,0 +1,3 @@
# 如果发现 npm / yarn 安装太慢,可以解除注释
# registry=https://registry.npm.taobao.org/
# ELECTRON_MIRROR=https://npm.taobao.org/mirrors/electron

@ -1,18 +1,18 @@
{
"name": "YesPlayMusic",
"name": "yes-play-music",
"version": "0.1.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint",
"electron:build": "vue-cli-service electron:build",
"electron:serve": "vue-cli-service electron:serve",
"postinstall": "electron-builder install-app-deps",
"postuninstall": "electron-builder install-app-deps",
"prettier": "npx prettier --write ./src"
},
"husky": {
"hooks": {
"pre-commit": "npm run prettier"
}
},
"main": "background.js",
"dependencies": {
"@sentry/browser": "^5.27.0",
"@sentry/integrations": "^5.27.0",
@ -21,6 +21,9 @@
"core-js": "^3.6.5",
"crypto-js": "^4.0.0",
"dayjs": "^1.8.36",
"electron-is-dev": "^1.2.0",
"electron-log": "^4.2.4",
"electron-updater": "^4.3.5",
"howler": "^2.2.0",
"js-cookie": "^2.2.1",
"nprogress": "^0.2.0",
@ -30,11 +33,13 @@
"svg-sprite-loader": "^5.0.0",
"vue": "^2.6.11",
"vue-analytics": "^5.22.1",
"vue-electron": "^1.0.6",
"vue-global-events": "^1.2.1",
"vue-i18n": "^8.22.0",
"vue-router": "^3.4.3",
"vue-slider-component": "^3.2.5",
"vuex": "^3.4.0"
"vuex": "^3.4.0",
"vuex-electron": "^1.0.3"
},
"devDependencies": {
"@vue/cli-plugin-babel": "~4.5.0",
@ -43,11 +48,15 @@
"@vue/cli-plugin-vuex": "~4.5.0",
"@vue/cli-service": "~4.5.0",
"babel-eslint": "^10.1.0",
"electron": "^10.1.4",
"electron-debug": "^3.1.0",
"electron-devtools-installer": "^3.1.1",
"eslint": "^6.7.2",
"eslint-plugin-vue": "^6.2.2",
"husky": "^4.3.0",
"sass": "^1.26.11",
"sass-loader": "^10.0.2",
"vue-cli-plugin-electron-builder": "~2.0.0-rc.4",
"vue-template-compiler": "^2.6.11"
},
"eslintConfig": {
@ -68,5 +77,10 @@
"> 1%",
"last 2 versions",
"not dead"
]
],
"husky": {
"hooks": {
"pre-commit": "npm run prettier"
}
}
}

@ -0,0 +1,89 @@
'use strict'
import { app, protocol, BrowserWindow } from 'electron'
import { createProtocol } from 'vue-cli-plugin-electron-builder/lib'
import installExtension, { VUEJS_DEVTOOLS } from 'electron-devtools-installer'
const isDevelopment = process.env.NODE_ENV !== 'production'
// Keep a global reference of the window object, if you don't, the window will
// be closed automatically when the JavaScript object is garbage collected.
let win
// Scheme must be registered before the app is ready
protocol.registerSchemesAsPrivileged([
{ scheme: 'app', privileges: { secure: true, standard: true } }
])
function createWindow() {
// Create the browser window.
win = new BrowserWindow({
width: 1920,
height: 768,
webPreferences: {
// Use pluginOptions.nodeIntegration, leave this alone
// See nklayman.github.io/vue-cli-plugin-electron-builder/guide/security.html#node-integration for more info
nodeIntegration: process.env.ELECTRON_NODE_INTEGRATION
}
})
if (process.env.WEBPACK_DEV_SERVER_URL) {
// Load the url of the dev server if in development mode
win.loadURL(process.env.WEBPACK_DEV_SERVER_URL)
if (!process.env.IS_TEST) win.webContents.openDevTools()
} else {
createProtocol('app')
// Load the index.html when not in development
win.loadURL('app://./index.html')
}
win.on('closed', () => {
win = null
})
}
// Quit when all windows are closed.
app.on('window-all-closed', () => {
// On macOS it is common for applications and their menu bar
// to stay active until the user quits explicitly with Cmd + Q
if (process.platform !== 'darwin') {
app.quit()
}
})
app.on('activate', () => {
// On macOS it's common to re-create a window in the app when the
// dock icon is clicked and there are no other windows open.
if (win === null) {
createWindow()
}
})
// This method will be called when Electron has finished
// initialization and is ready to create browser windows.
// Some APIs can only be used after this event occurs.
app.on('ready', async () => {
if (isDevelopment && !process.env.IS_TEST) {
// Install Vue Devtools
try {
await installExtension(VUEJS_DEVTOOLS)
} catch (e) {
console.error('Vue Devtools failed to install:', e.toString())
}
}
createWindow()
})
// Exit cleanly on request from parent process in development mode.
if (isDevelopment) {
if (process.platform === 'win32') {
process.on('message', (data) => {
if (data === 'graceful-exit') {
app.quit()
}
})
} else {
process.on('SIGTERM', () => {
app.quit()
})
}
}

@ -27,7 +27,7 @@ module.exports = {
template: "public/index.html",
filename: "index.html",
title: "YesPlayMusic",
chunks: ["chunk-vendors", "chunk-common", "index"],
chunks: ["main", "chunk-vendors", "chunk-common", "index"],
},
},
chainWebpack(config) {
@ -45,4 +45,73 @@ module.exports = {
})
.end();
},
// 添加插件的配置
pluginOptions: {
// electron-builder的配置文件
electronBuilder: {
builderOptions: {
// files: [
// {
// 'filter': ['**/*']
// }
// ],
// extraFiles: ['./extensions/'],
// 应用名称
productName: 'Yes Play Music',
// 版权
copyright: 'Copyright © YesPlayMusic',
compression: "maximum",
// 是否打包加密
asar: true,
// // 项目打包生成的文件目录
// directories: {
// output: 'build'
// },
// window的icon头标
win: {
icon: 'public/favicon.ico'
},
// 是否静默安装
nsis: {
oneClick: false,
allowToChangeInstallationDirectory: true
}
},
// chainWebpackMainProcess: config => {
// config.module
// .rule('babel')
// .test(/\*.js$/)
// .use('babel')
// .loader('babel-loader')
// .options({
// presets: [['@babel/preset-env', '@vue/cli-plugin-babel/preset', { modules: false }]],
// plugins: ['@babel/plugin-proposal-class-properties']
// })
// },
// 渲染线程的配置文件
// chainWebpackRendererProcess: config => {
// // 渲染线程的一些其他配置
// // Chain webpack config for electron renderer process only
// // The following example will set IS_ELECTRON to true in your app
// config.plugin('define').tap((args) => {
// args[0]['IS_ELECTRON'] = true
// return args
// })
// },
// 主入口文件
// mainProcessFile: 'src/main.js',
// mainProcessWatch: [],
// mainProcessArgs: []
}
},
// 打包时不生成.map文件减少体积加快速度如果你不需要生产环境的 source map可以将其设置为 false 以加速生产环境构建。
productionSourceMap: false,
// 放置生成的静态资源 (js、css、img、fonts) 的 (相对于 outputDir 的) 目录。
assetsDir: 'src/renderer/static',
// 跨域配置
devServer: {
disableHostCheck: true
},
// css 样式
css: {}
};

File diff suppressed because it is too large Load Diff
Loading…
Cancel
Save