术习电报 / electron-vue-template

转到一个项目
切换导航栏
切换导航栏固定状态
张恒
0109f74a 1 个父辈 d26257fd

修正当选择为web打包时出现报错得问题

内嵌 并排
正在显示 7 个修改的文件 包含 134 行增加 和 80 行删除
......@@ -9,6 +9,7 @@ const MinifyPlugin = require("babel-minify-webpack-plugin");
const CopyWebpackPlugin = require('copy-webpack-plugin')
const MiniCssExtractPlugin = require('mini-css-extract-plugin')
const HtmlWebpackPlugin = require('html-webpack-plugin')
const TerserPlugin = require('terser-webpack-plugin');
const { VueLoaderPlugin } = require('vue-loader')
function resolve(dir) {
......@@ -87,6 +88,7 @@ let webConfig = {
use: {
loader: 'url-loader',
query: {
esModule: false,
limit: 10000,
name: 'imgs/[name].[ext]'
}
......@@ -97,6 +99,7 @@ let webConfig = {
use: {
loader: 'url-loader',
query: {
esModule: false,
limit: 10000,
name: 'fonts/[name].[ext]'
}
......@@ -159,6 +162,50 @@ if (process.env.NODE_ENV === 'production') {
minimize: true
})
)
webConfig.optimization = {
splitChunks: {
chunks: "async",
cacheGroups: {
vendor: { // 将第三方模块提取出来
minSize: 30000,
minChunks: 1,
test: /node_modules/,
chunks: 'initial',
name: 'vendor',
priority: 1
},
commons: {
test: /[\\/]src[\\/]common[\\/]/,
name: 'commons',
minSize: 30000,
minChunks: 3,
chunks: 'initial',
priority: -1,
reuseExistingChunk: true // 这个配置允许我们使用已经存在的代码块
}
}
},
runtimeChunk: { name: 'runtime' },
minimizer: [
new TerserPlugin({
test: /\.js(\?.*)?$/i,
extractComments: false,
cache: false,
sourceMap: false,
terserOptions: {
warnings: false,
compress: {
warnings: false,
drop_console: true,
drop_debugger: true,
pure_funcs: ['console.log']
},
output: {
comments: false,
},
}
})]
}
}
module.exports = webConfig
......
......@@ -42,6 +42,7 @@ npm config edit
这是花裤衩大大原本的[地址](https://github.com/PanJiaChen/electron-vue-admin)
# 更新日志
- 2020年04月29日：添加了路由多窗口示例，修复web打包，提升依赖；文档还未就绪
- 2020年02月09日：添加[中文在线文档](https://umbrella22.github.io/electron-vue-template-doc/)，[国内访问地址](https://zh-sky.gitee.io/electron-vue-template-doc/)
- 剔除win打包依赖，因为太大了，将它放到码云的额外仓库中，[地址](https://gitee.com/Zh-Sky/HardToDownloadLib)
- 2020年02月06日更新：激进分支更新至8.0.0.
......
......@@ -9700,7 +9700,7 @@
},
"matcher": {
"version": "2.1.0",
"resolved": "https://registry.npm.taobao.org/matcher/download/matcher-2.1.0.tgz",
"resolved": "https://registry.npm.taobao.org/matcher/download/matcher-2.1.0.tgz?cache=0&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fmatcher%2Fdownload%2Fmatcher-2.1.0.tgz",
"integrity": "sha1-ZOEEHBW5k+I7eG+TMgp0dL+DPCg=",
"dev": true,
"optional": true,
......@@ -9710,7 +9710,7 @@
"dependencies": {
"escape-string-regexp": {
"version": "2.0.0",
"resolved": "https://registry.npm.taobao.org/escape-string-regexp/download/escape-string-regexp-2.0.0.tgz",
"resolved": "https://registry.npm.taobao.org/escape-string-regexp/download/escape-string-regexp-2.0.0.tgz?cache=0&sync_timestamp=1586278520081&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fescape-string-regexp%2Fdownload%2Fescape-string-regexp-2.0.0.tgz",
"integrity": "sha1-owME6Z2qMuI7L9IPUbq9B8/8o0Q=",
"dev": true,
"optional": true
......@@ -11402,7 +11402,7 @@
},
"posthtml": {
"version": "0.9.2",
"resolved": "https://registry.npm.taobao.org/posthtml/download/posthtml-0.9.2.tgz",
"resolved": "https://registry.npm.taobao.org/posthtml/download/posthtml-0.9.2.tgz?cache=0&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fposthtml%2Fdownload%2Fposthtml-0.9.2.tgz",
"integrity": "sha1-9MBtufZ7Yf0XxOJW5+PZUVv3Jv0=",
"dev": true,
"requires": {
......
......@@ -54,7 +54,6 @@
<script>
import SystemInformation from "./LandingPage/SystemInformation";
import ipcApi from "../utils/ipcRenderer";
import { message } from "@/api/login";
export default {
name: "landing-page",
......@@ -87,7 +86,7 @@ export default {
let data = {
url:'/form/index'
}
ipcApi.send("open-win", data);
this.$ipcApi.send("open-win", data);
},
getMessage() {
message().then(res => {
......@@ -97,8 +96,8 @@ export default {
});
},
StartServer() {
ipcApi.send("statr-server");
ipcApi.on("confirm-start", (event, arg) => {
this.$ipcApi.send("statr-server");
this.$ipcApi.on("confirm-start", (event, arg) => {
console.log(arg);
this.$message({
type: "success",
......@@ -137,8 +136,8 @@ export default {
noLink: true,
message: "此操作会清空本地数据库中的所有数据，是否继续？"
};
ipcApi.send("open-messagebox", data);
ipcApi.on("confirm-message", (event, arg) => {
this.$ipcApi.send("open-messagebox", data);
this.$ipcApi.on("confirm-message", (event, arg) => {
console.log(arg);
if (arg.response === 0) {
this.$db.deleall({ name: "yyy" }).then(res => {
......@@ -154,7 +153,7 @@ export default {
title: "错误",
message: "已经没有数据可以被删除！"
};
ipcApi.send("open-errorbox", errormsg);
this.$ipcApi.send("open-errorbox", errormsg);
}
});
}
......@@ -164,9 +163,9 @@ export default {
switch (data) {
case "one":
const dialog = this.$electron.remote.dialog;
ipcApi.send("check-update");
this.$ipcApi.send("check-update");
console.log("启动检查");
ipcApi.on("UpdateMsg", (event, data) => {
this.$ipcApi.on("UpdateMsg", (event, data) => {
console.log(data);
switch (data.state) {
case -1:
......@@ -196,7 +195,7 @@ export default {
this.$alert("更新下载完成！", "提示", {
confirmButtonText: "确定",
callback: action => {
ipcApi.send("confirm-update");
this.$ipcApi.send("confirm-update");
}
});
break;
......@@ -208,34 +207,34 @@ export default {
break;
case "two":
console.log(111);
ipcApi.send("start-download");
ipcApi.on("confirm-download", (event, arg) => {
this.$ipcApi.send("start-download");
this.$ipcApi.on("confirm-download", (event, arg) => {
if (arg) {
this.dialogVisible = true;
}
});
ipcApi.on("download-progress", (event, arg) => {
this.$ipcApi.on("download-progress", (event, arg) => {
this.percentage = Number(arg);
});
ipcApi.on("download-error", (event, arg) => {
this.$ipcApi.on("download-error", (event, arg) => {
if (arg) {
this.progressStaus = "exception";
this.percentage = 40;
this.colors = "#d81e06";
}
});
ipcApi.on("download-paused", (event, arg) => {
this.$ipcApi.on("download-paused", (event, arg) => {
if (arg) {
this.progressStaus = "warning";
this.$alert("下载由于未知原因被中断！", "提示", {
confirmButtonText: "重试",
callback: action => {
ipcApi.send("satrt-download");
this.$ipcApi.send("satrt-download");
}
});
}
});
ipcApi.on("download-done", (event, age) => {
this.$ipcApi.on("download-done", (event, age) => {
this.filePath = age.filePath;
this.progressStaus = "success";
this.$alert("更新下载完成！", "提示", {
......@@ -256,12 +255,12 @@ export default {
}
},
destroyed() {
ipcApi.remove("confirm-message");
ipcApi.remove("download-done");
ipcApi.remove("download-paused");
ipcApi.remove("confirm-download");
ipcApi.remove("download-progress");
ipcApi.remove("download-error");
this.$ipcApi.remove("confirm-message");
this.$ipcApi.remove("download-done");
this.$ipcApi.remove("download-paused");
this.$ipcApi.remove("confirm-download");
this.$ipcApi.remove("download-progress");
this.$ipcApi.remove("download-error");
}
};
</script>
......
......@@ -35,49 +35,51 @@
</template>
<script>
export default {
data () {
return {
electron: process.versions.electron,
name: this.$route.name,
node: process.versions.node,
path: this.$route.path,
platform: require('os').platform(),
arch:require('os').arch(),
vue: require('vue/package.json').version
}
},
mounted(){
console.log(this.$route)
}
export default {
data() {
return {
electron: process.versions.electron || "浏览器环境",
name: this.$route.name,
node: process.versions.node || "浏览器环境",
path: this.$route.path,
platform: require("os").platform(),
arch: require("os").arch(),
vue: require("vue/package.json").version
};
},
mounted() {
console.log(this.$route);
}
};
</script>
<style scoped>
.title {
color: #888;
font-size: 18px;
font-weight: initial;
letter-spacing: .25px;
margin-top: 10px;
}
.title {
color: #888;
font-size: 18px;
font-weight: initial;
letter-spacing: 0.25px;
margin-top: 10px;
}
.items { margin-top: 8px; }
.items {
margin-top: 8px;
}
.item {
display: flex;
align-items: center;
margin-bottom: 6px;
line-height: 24px;
}
.item {
display: flex;
align-items: center;
margin-bottom: 6px;
line-height: 24px;
}
.item .name {
color: #6a6a6a;
margin-right: 6px;
}
.item .name {
color: #6a6a6a;
margin-right: 6px;
}
.item .value {
color: #35495e;
font-weight: bold;
}
.item .value {
color: #35495e;
font-weight: bold;
}
</style>
......
<!-- -->
<template>
<div class="window-title" v-if="!IsUseSysTitle&&isMac">
<div class="window-title" v-if="!IsUseSysTitle&&isMac&&!IsWeb">
<!-- 软件logo预留位置 -->
<div style="-webkit-app-region: drag;" class="logo">
<svg-icon icon-class="electron-logo"></svg-icon>
......@@ -25,32 +25,35 @@
</template>
<script>
import ipcApi from "@/utils/ipcRenderer";
export default {
data: () => ({
mix: false,
IsUseSysTitle: false,
isMac:process.platform !== 'darwin'
isMac: process.platform !== "darwin",
IsWeb: process.env.IS_WEB
}),
components: {},
created() {
ipcApi.send("IsUseSysTitle");
ipcApi.on("CisUseSysTitle", (event, arg) => (this.IsUseSysTitle = arg));
this.$ipcApi.send("IsUseSysTitle");
this.$ipcApi.on(
"CisUseSysTitle",
(event, arg) => (this.IsUseSysTitle = arg)
);
},
mounted() {},
methods: {
Mini() {
ipcApi.send("windows-mini");
this.$ipcApi.send("windows-mini");
},
MixOrReduction() {
ipcApi.send("window-max");
ipcApi.on("window-confirm", (event, arg) => (this.mix = arg));
this.$ipcApi.send("window-max");
this.$ipcApi.on("window-confirm", (event, arg) => (this.mix = arg));
},
Close() {
ipcApi.send("window-close");
this.$ipcApi.send("window-close");
}
}
};
......@@ -69,7 +72,7 @@ export default {
.title {
text-align: center;
}
.logo{
.logo {
margin-left: 20px;
}
.controls-container {
......
......@@ -3,8 +3,6 @@ import Vue from 'vue'
import App from './App'
import router from './router'
import store from './store'
// 导入数据操作库
import db from './api/operationalData'
// 引用element
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
......@@ -14,14 +12,18 @@ import './error'
import './icons'
import '@/styles/index.scss'
if (!require('../../config').IsUseSysTitle) require('@/styles/custom-title.scss')
if (!process.env.IS_WEB) Vue.use(require('vue-electron'))
if (!process.env.IS_WEB) {
Vue.use(require('vue-electron'))
if (!require('../../config').IsUseSysTitle) {
require('@/styles/custom-title.scss')
}
// 当处于electron状态下才引用db
Vue.prototype.$db = require('./api/operationalData').default
Vue.prototype.$ipcApi = require('./utils/ipcRenderer').default
}
Vue.use(ElementUI)
Vue.prototype.$db = db
Vue.config.productionTip = false
/* eslint-disable no-new */
const vue = new Vue({
......