Skip to content

V
video-monitoring
Commit c6dfd71f authored by 拾柒's avatar 拾柒
Browse files
Options

Merge branch 'master' into dev-yingshi 

# Conflicts:
#	src/router/index.js
#	vue.config.js
parents 85b1e20e 90d199c8
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 986 additions and 495 deletions
.env.development
View file @ c6dfd71f
...@@ -5,7 +5,7 @@ VUE_APP_TITLE = 悦优享视频监控管理系统 ...@@ -5,7 +5,7 @@ VUE_APP_TITLE = 悦优享视频监控管理系统
ENV = 'development' ENV = 'development'
# 悦优享视频监控管理系统/开发环境 # 悦优享视频监控管理系统/开发环境
VUE_APP_BASE_API = '/dev-api'
VUE_APP_BASE_API = ''
# 路由懒加载 # 路由懒加载
VUE_CLI_BABEL_TRANSPILE_MODULES = true VUE_CLI_BABEL_TRANSPILE_MODULES = true
src/assets/styles/index.scss
View file @ c6dfd71f
...@@ -127,9 +127,9 @@ aside { ...@@ -127,9 +127,9 @@ aside {
margin: 0; margin: 0;
//padding: 0; //padding: 0;
overflow: hidden; /* 防止内容溢出 */ overflow: hidden; /* 防止内容溢出 */
padding-left: 20px; padding-left: 40px;
padding-right: 20px; padding-right: 40px;
padding-top: 10px; padding-top: 20px;
background-color: #D4D9E5; background-color: #D4D9E5;
} }
......
src/layout/components/Navbar.vue
View file @ c6dfd71f
<template> <template>
<div class="navbar"> <div class="navbar">
<hamburger id="hamburger-container" :is-active="sidebar.opened" class="hamburger-container" @toggleClick="toggleSideBar" v-if = "false"/> <hamburger id="hamburger-container" :is-active="sidebar.opened" class="hamburger-container"
<!-- <breadcrumb id="breadcrumb-container" class="breadcrumb-container" v-if="!topNav"/>--> @toggleClick="toggleSideBar" v-if="false"/>
<!-- <breadcrumb id="breadcrumb-container" class="breadcrumb-container" v-if="!topNav"/>-->
<img src="../../assets/images/titlePic.png" alt="" style="width: 200px;height: 80px;"> <img src="../../assets/images/titlePic.png" alt="" style="width: 200px;height: 80px;">
<top-nav id="topmenu-container" class="topmenu-container" v-if="topNav"/> <top-nav id="topmenu-container" class="topmenu-container" v-if="topNav"/>
<div class="right-menu" style="margin-top: 20px"> <div class="right-menu" style="margin-top: 20px">
<el-dropdown class="avatar-container right-menu-item hover-effect" trigger="click"> <el-dropdown class="avatar-container right-menu-item hover-effect" trigger="click">
<div class="avatar-wrapper"> <div class="avatar-wrapper">
<img :src="avatar" class="user-avatar"> <img :src="avatar" class="user-avatar">
<i class="el-icon-caret-bottom" /> <i class="el-icon-caret-bottom"/>
</div> </div>
<el-dropdown-menu slot="dropdown"> <el-dropdown-menu slot="dropdown">
<router-link to="/user/profile"> <router-link to="/user/profile">
...@@ -17,6 +18,32 @@ ...@@ -17,6 +18,32 @@
<el-dropdown-item @click.native="setting = true"> <el-dropdown-item @click.native="setting = true">
<span>布局设置</span> <span>布局设置</span>
</el-dropdown-item> </el-dropdown-item>
<!-- sunyu 新加了修改密码的弹窗,完成修改密码功能-->
<el-dropdown-item @click.native="resetPwdVisible = true">
<span>修改密码</span>
</el-dropdown-item>
<el-dialog title="修改密码" :visible.sync="resetPwdVisible" :before-close="handleClose" append-to-body="true">
<el-form ref="form" :model="user" :rules="rules" label-width="80px">
<el-form-item label="旧密码" prop="oldPassword">
<el-input v-model="user.oldPassword" placeholder="请输入旧密码" type="password" show-password/>
</el-form-item>
<el-form-item label="新密码" prop="newPassword">
<el-input v-model="user.newPassword" placeholder="请输入新密码" type="password" show-password/>
</el-form-item>
<el-form-item label="确认密码" prop="confirmPassword">
<el-input v-model="user.confirmPassword" placeholder="请确认新密码" type="password" show-password/>
</el-form-item>
<el-form-item>
<el-button type="primary" size="mini" @click="submit">保存</el-button>
<el-button type="danger" size="mini" @click="close">关闭</el-button>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click.native="resetPwdVisible = false">取 消</el-button>
<el-button type="primary" @click.native="resetPwdVisible = false">确 定</el-button>
</span>
</el-dialog>
<el-dropdown-item divided @click.native="logout"> <el-dropdown-item divided @click.native="logout">
<span>退出登录</span> <span>退出登录</span>
</el-dropdown-item> </el-dropdown-item>
...@@ -27,7 +54,7 @@ ...@@ -27,7 +54,7 @@
</template> </template>
<script> <script>
import { mapGetters } from 'vuex' import {mapGetters} from 'vuex'
import Breadcrumb from '@/components/Breadcrumb' import Breadcrumb from '@/components/Breadcrumb'
import TopNav from '@/components/TopNav' import TopNav from '@/components/TopNav'
import Hamburger from '@/components/Hamburger' import Hamburger from '@/components/Hamburger'
...@@ -36,8 +63,43 @@ import SizeSelect from '@/components/SizeSelect' ...@@ -36,8 +63,43 @@ import SizeSelect from '@/components/SizeSelect'
import Search from '@/components/HeaderSearch' import Search from '@/components/HeaderSearch'
import RuoYiGit from '@/components/RuoYi/Git' import RuoYiGit from '@/components/RuoYi/Git'
import RuoYiDoc from '@/components/RuoYi/Doc' import RuoYiDoc from '@/components/RuoYi/Doc'
import {updateUserPwd} from "@/api/system/user";
export default { export default {
data() {
const equalToPassword = (rule, value, callback) => {
if (this.user.newPassword !== value) {
callback(new Error("两次输入的密码不一致"));
} else {
callback();
}
};
return {
user: {
oldPassword: undefined,
newPassword: undefined,
confirmPassword: undefined,
},
// 表单校验
rules: {
oldPassword: [
{required: true, message: "旧密码不能为空", trigger: "blur"}
],
newPassword: [
{required: true, message: "新密码不能为空", trigger: "blur"},
{min: 6, max: 20, message: "长度在 6 到 20 个字符", trigger: "blur"},
{pattern: /^[^<>"'|\\]+$/, message: "不能包含非法字符：< > \" ' \\\ |", trigger: "blur"}
],
confirmPassword: [
{required: true, message: "确认密码不能为空", trigger: "blur"},
{required: true, validator: equalToPassword, trigger: "blur"}
]
},
resetPwdVisible: false,
};
},
components: { components: {
Breadcrumb, Breadcrumb,
TopNav, TopNav,
...@@ -72,6 +134,29 @@ export default { ...@@ -72,6 +134,29 @@ export default {
} }
}, },
methods: { methods: {
submit() {
this.$refs["form"].validate(valid => {
if (valid) {
updateUserPwd(this.user.oldPassword, this.user.newPassword).then(response => {
this.$modal.msgSuccess("修改成功");
});
}
});
},
close() {
this.$tab.closePage();
},
handleClose(done) {
this.$confirm('确定关闭吗').then(() => {
// function(done)，done 用于关闭 Dialog
done();
console.info("点击右上角 'X' ，取消按钮或遮罩层时触发");
}).catch(() => {
console.log("点击确定时触发");
});
},
toggleSideBar() { toggleSideBar() {
this.$store.dispatch('app/toggleSideBar') this.$store.dispatch('app/toggleSideBar')
}, },
...@@ -84,7 +169,8 @@ export default { ...@@ -84,7 +169,8 @@ export default {
this.$store.dispatch('LogOut').then(() => { this.$store.dispatch('LogOut').then(() => {
location.href = '/index'; location.href = '/index';
}) })
}).catch(() => {}); }).catch(() => {
});
} }
} }
} }
...@@ -97,15 +183,16 @@ export default { ...@@ -97,15 +183,16 @@ export default {
overflow: hidden; overflow: hidden;
position: relative; position: relative;
background: #fff; background: #fff;
box-shadow: 0 1px 4px rgba(0,21,41,.08); box-shadow: 0 1px 4px rgba(0, 21, 41, .08);
justify-content: space-between; justify-content: space-between;
.hamburger-container { .hamburger-container {
line-height: 46px; line-height: 46px;
height: 100%; height: 100%;
float: left; float: left;
cursor: pointer; cursor: pointer;
transition: background .3s; transition: background .3s;
-webkit-tap-highlight-color:transparent; -webkit-tap-highlight-color: transparent;
&:hover { &:hover {
background: rgba(0, 0, 0, .025) background: rgba(0, 0, 0, .025)
...@@ -117,7 +204,7 @@ export default { ...@@ -117,7 +204,7 @@ export default {
} }
.topmenu-container { .topmenu-container {
margin-top:30px ; margin-top: 30px;
//margin-left: -10px; //margin-left: -10px;
//height: 80px; //height: 80px;
//position: absolute; //position: absolute;
......
src/router/index.js
View file @ c6dfd71f
import Vue from 'vue' import Vue from "vue";
import Router from 'vue-router' import Router from "vue-router";
Vue.use(Router) Vue.use(Router);
/* Layout */ /* Layout */
import Layout from '@/layout' import Layout from "@/layout";
/** /**
* Note: 路由配置项 * Note: 路由配置项
...@@ -31,209 +31,210 @@ import Layout from '@/layout' ...@@ -31,209 +31,210 @@ import Layout from '@/layout'
// 公共路由 // 公共路由
export const constantRoutes = [ export const constantRoutes = [
{ {
path: '/redirect', path: "/redirect",
component: Layout, component: Layout,
hidden: true, hidden: true,
children: [ children: [
{ {
path: '/redirect/:path(.*)', path: "/redirect/:path(.*)",
component: () => import('@/views/redirect') component: () => import("@/views/redirect"),
} },
] ],
}, },
{ {
path: '/login', path: "/login",
component: () => import('@/views/login'), component: () => import("@/views/login"),
hidden: true hidden: true,
}, },
{ {
path: '/register', path: "/register",
component: () => import('@/views/register'), component: () => import("@/views/register"),
hidden: true hidden: true,
}, },
{ {
path: '/404', path: "/404",
component: () => import('@/views/error/404'), component: () => import("@/views/error/404"),
hidden: true hidden: true,
}, },
{ {
path: '/401', path: "/401",
component: () => import('@/views/error/401'), component: () => import("@/views/error/401"),
hidden: true hidden: true,
}, },
{ {
path: '', path: "",
component: Layout, component: Layout,
redirect: 'index', redirect: "index",
children: [ children: [
{ {
path: 'index', path: "index",
component: () => import('@/views/video/index'), component: () => import("@/views/video/index"),
name: 'Index', name: "Index",
meta: { title: '首页', icon: 'dashboard', affix: true } meta: { title: "首页", icon: "dashboard", affix: true },
} },
] ],
}, },
{ {
path: '/user', path: "/user",
component: Layout, component: Layout,
hidden: true, hidden: true,
redirect: 'noredirect', redirect: "noredirect",
children: [ children: [
{ {
path: 'profile', path: "profile",
component: () => import('@/views/system/user/profile/index'), component: () => import("@/views/system/user/profile/index"),
name: 'Profile', name: "Profile",
meta: { title: '个人中心', icon: 'user' } meta: { title: "个人中心", icon: "user" },
} },
] ],
}, },
{ {
path: '/monitoring', path: "/monitoring",
component: Layout, component: Layout,
hidden: false, hidden: false,
redirect: '/monitoring/video', redirect: "/monitoring/video",
children: [ children: [
{ {
path: 'video', path: "video",
component: () => import('@/views/video/index'), component: () => import("@/views/video/index"),
name: 'Video', name: "Video",
meta: { title: '视频监控', icon: 'user' } meta: { title: "视频监控", icon: "user" },
} },
] ],
}, },
{ {
path: '/monitoringPlayback', path: "/monitoringPlayback",
component: Layout, component: Layout,
hidden: false, hidden: false,
redirect: 'monitoringPlayback/playback', redirect: "monitoringPlayback/playback",
children: [ children: [
{ {
path: 'playback', path: "playback",
component: () => import('@/views/video/playback'), component: () => import("@/views/video/playback"),
name: 'Playback', name: "Playback",
meta: { title: '视频回放', icon: 'user' } meta: { title: "视频回放", icon: "user" },
} },
] ],
}, },
{ {
path: '/monitoringhistory', path: "/monitoringhistory",
component: Layout, component: Layout,
hidden: false, hidden: false,
redirect: 'monitoringhistory/history', redirect: "monitoringhistory/history",
children: [ children: [
{ {
path: 'history', path: "history",
component: () => import('@/views/history/index'), component: () => import("@/views/history/index"),
name: 'History', name: "History",
meta: { title: '历史记录', icon: 'user' } meta: { title: "历史记录", icon: "user" },
} },
] ],
}, },
{ {
path: '/yingshi', path: "/employee",
component: Layout, component: Layout,
hidden: false, hidden: false,
redirect: 'yingshi', redirect: "employee",
children: [ children: [
{ {
path: 'yingshi', path: "employee",
component: () => import('@/views/video/yingshi.vue'), component: () => import("@/views/employee/index"),
name: 'yingshi', name: "employee",
meta: { title: '员工信息', icon: 'user' } meta: { title: "员工信息", icon: "user" },
} },
] ],
} },
] ];
// 动态路由，基于用户权限动态去加载 // 动态路由，基于用户权限动态去加载
export const dynamicRoutes = [ export const dynamicRoutes = [
{ {
path: '/system/user-auth', path: "/system/user-auth",
component: Layout, component: Layout,
hidden: true, hidden: true,
permissions: ['system:user:edit'], permissions: ["system:user:edit"],
children: [ children: [
{ {
path: 'role/:userId(\\d+)', path: "role/:userId(\\d+)",
component: () => import('@/views/system/user/authRole'), component: () => import("@/views/system/user/authRole"),
name: 'AuthRole', name: "AuthRole",
meta: { title: '分配角色', activeMenu: '/system/user' } meta: { title: "分配角色", activeMenu: "/system/user" },
} },
] ],
}, },
{ {
path: '/system/role-auth', path: "/system/role-auth",
component: Layout, component: Layout,
hidden: true, hidden: true,
permissions: ['system:role:edit'], permissions: ["system:role:edit"],
children: [ children: [
{ {
path: 'user/:roleId(\\d+)', path: "user/:roleId(\\d+)",
component: () => import('@/views/system/role/authUser'), component: () => import("@/views/system/role/authUser"),
name: 'AuthUser', name: "AuthUser",
meta: { title: '分配用户', activeMenu: '/system/role' } meta: { title: "分配用户", activeMenu: "/system/role" },
} },
] ],
}, },
{ {
path: '/system/dict-data', path: "/system/dict-data",
component: Layout, component: Layout,
hidden: true, hidden: true,
permissions: ['system:dict:list'], permissions: ["system:dict:list"],
children: [ children: [
{ {
path: 'index/:dictId(\\d+)', path: "index/:dictId(\\d+)",
component: () => import('@/views/system/dict/data'), component: () => import("@/views/system/dict/data"),
name: 'Data', name: "Data",
meta: { title: '字典数据', activeMenu: '/system/dict' } meta: { title: "字典数据", activeMenu: "/system/dict" },
} },
] ],
}, },
{ {
path: '/monitor/job-log', path: "/monitor/job-log",
component: Layout, component: Layout,
hidden: true, hidden: true,
permissions: ['monitor:job:list'], permissions: ["monitor:job:list"],
children: [ children: [
{ {
path: 'index/:jobId(\\d+)', path: "index/:jobId(\\d+)",
component: () => import('@/views/monitor/job/log'), component: () => import("@/views/monitor/job/log"),
name: 'JobLog', name: "JobLog",
meta: { title: '调度日志', activeMenu: '/monitor/job' } meta: { title: "调度日志", activeMenu: "/monitor/job" },
} },
] ],
}, },
{ {
path: '/tool/gen-edit', path: "/tool/gen-edit",
component: Layout, component: Layout,
hidden: true, hidden: true,
permissions: ['tool:gen:edit'], permissions: ["tool:gen:edit"],
children: [ children: [
{ {
path: 'index/:tableId(\\d+)', path: "index/:tableId(\\d+)",
component: () => import('@/views/tool/gen/editTable'), component: () => import("@/views/tool/gen/editTable"),
name: 'GenEdit', name: "GenEdit",
meta: { title: '修改生成配置', activeMenu: '/tool/gen' } meta: { title: "修改生成配置", activeMenu: "/tool/gen" },
} },
] ],
} },
] ];
// 防止连续点击多次路由报错 // 防止连续点击多次路由报错
let routerPush = Router.prototype.push; let routerPush = Router.prototype.push;
let routerReplace = Router.prototype.replace; let routerReplace = Router.prototype.replace;
// push // push
Router.prototype.push = function push(location) { Router.prototype.push = function push(location) {
return routerPush.call(this, location).catch(err => err) return routerPush.call(this, location).catch((err) => err);
} };
// replace // replace
Router.prototype.replace = function push(location) { Router.prototype.replace = function push(location) {
return routerReplace.call(this, location).catch(err => err) return routerReplace.call(this, location).catch((err) => err);
} };
export default new Router({ export default new Router({
mode: 'history', // 去掉url中的# mode: "history", // 去掉url中的#
scrollBehavior: () => ({ y: 0 }), scrollBehavior: () => ({ y: 0 }),
routes: constantRoutes routes: constantRoutes,
}) });
src/utils/request.js
View file @ c6dfd71f
...@@ -124,29 +124,36 @@ service.interceptors.response.use(res => { ...@@ -124,29 +124,36 @@ service.interceptors.response.use(res => {
// 通用下载方法 // 通用下载方法
export function download(url, params, filename, config) { export function download(url, params, filename, config) {
downloadLoadingInstance = Loading.service({ text: "正在下载数据，请稍候", spinner: "el-icon-loading", background: "rgba(0, 0, 0, 0.7)", }) downloadLoadingInstance = Loading.service({
text: "正在下载数据，请稍候",
spinner: "el-icon-loading",
background: "rgba(0, 0, 0, 0.7)"
});
return service.post(url, params, { return service.post(url, params, {
transformRequest: [(params) => { return tansParams(params) }], transformRequest: [function (data) {
headers: { 'Content-Type': 'application/x-www-form-urlencoded' }, return JSON.stringify(data); // 将参数转换为 JSON 字符串
}],
headers: { 'Content-Type': 'application/json' }, // 设置 Content-Type 为 application/json
responseType: 'blob', responseType: 'blob',
...config ...config
}).then(async (data) => { }).then(async (data) => {
const isBlob = blobValidate(data); const isBlob = blobValidate(data);
if (isBlob) { if (isBlob) {
const blob = new Blob([data]) const blob = new Blob([data]);
saveAs(blob, filename) saveAs(blob, filename);
} else { } else {
const resText = await data.text(); const resText = await data.text();
const rspObj = JSON.parse(resText); const rspObj = JSON.parse(resText);
const errMsg = errorCode[rspObj.code] || rspObj.msg || errorCode['default'] const errMsg = errorCode[rspObj.code] || rspObj.msg || errorCode['default'];
Message.error(errMsg); Message.error(errMsg);
} }
downloadLoadingInstance.close(); downloadLoadingInstance.close();
}).catch((r) => { }).catch((error) => {
console.error(r) console.error(error);
Message.error('下载文件出现错误，请联系管理员！') Message.error('下载文件出现错误，请联系管理员！');
downloadLoadingInstance.close(); downloadLoadingInstance.close();
}) });
} }
export default service export default service
src/views/employee/index.vue
View file @ c6dfd71f
This diff is collapsed.
src/views/history/index.vue
View file @ c6dfd71f
This diff is collapsed.
src/views/video/index.vue
View file @ c6dfd71f
<template> <template>
<div style="background-color: #D4D9E5"> <div style="background-color: #D4D9E5">
<div class="hello-ezuikit-js" style="padding:20px 30px;display: flex"> <div class="hello-ezuikit-js" style="padding:20px 30px;display: flex">
......
src/views/video/playback.vue
View file @ c6dfd71f
<template> <template>
<div class="playback"> <div class="playback">
<div ref="playWndBack" class="video-watch" id="playWndBack"></div> <div ref="playWndBack" class="video-watch" id="playWndBack"></div>
<div> <div style="margin-right: 30px;margin-top: 60px">
<el-form label-position="right" label-width="100px" :model="formLabelAlign"> <el-form label-position="right" label-width="100px" :model="formLabelAlign">
<el-form-item label="监控点名称"> <el-form-item label="监控点名称">
<el-input v-model="formLabelAlign.name" disabled></el-input> <el-input v-model="carryRowCode.id" disabled></el-input>
</el-form-item> </el-form-item>
<el-form-item label="开始时间"> <el-form-item label="开始时间">
<el-input v-model="formLabelAlign.startTime" disabled></el-input> <el-input v-model="carryRowCode.monitoringStarttime" disabled></el-input>
</el-form-item> </el-form-item>
<el-form-item label="结束时间"> <el-form-item label="结束时间">
<el-input v-model="formLabelAlign.endTime" disabled></el-input> <el-input v-model="carryRowCode.monitoringFinallytime" disabled></el-input>
</el-form-item> </el-form-item>
<el-form-item label="监控时间"> <el-form-item label="监控时间">
<el-input v-model="formLabelAlign.time" disabled></el-input> <el-input v-model="carryRowCode.monitorTime" disabled></el-input>
</el-form-item> </el-form-item>
<el-form-item label="监控状态"> <el-form-item label="监控状态">
<el-input v-model="formLabelAlign.flag" disabled></el-input> <el-input v-model="carryRowCode.monitorState" disabled></el-input>
</el-form-item> </el-form-item>
</el-form> </el-form>
</div> </div>
...@@ -27,11 +27,14 @@ ...@@ -27,11 +27,14 @@
<script> <script>
import {getCameras} from "@/api/system/video"; import {getCameras} from "@/api/system/video";
import videoParams from "@/views/video/videoParams"; import videoParams from "@/views/video/videoParams";
import {listHistable, getHistable, delHistable, addHistable, updateHistable} from "@/api/system/histable";
export default { export default {
name: "playback", name: "playback",
data() { data() {
return { return {
carryRowCode:{},
oWebControl: null, oWebControl: null,
initCount: 0, initCount: 0,
pubKey: '', pubKey: '',
...@@ -45,6 +48,9 @@ export default { ...@@ -45,6 +48,9 @@ export default {
} }
}; };
}, },
created() {
this.carryRowCode = this.$route.query.carryRowCode;
},
mounted() { mounted() {
this.getIndex() this.getIndex()
}, },
...@@ -227,7 +233,11 @@ export default { ...@@ -227,7 +233,11 @@ export default {
<style scoped> <style scoped>
.playback{ .playback{
display: flex; display: flex;
margin: 0 20px; margin-top: 20px;
margin-left: 40px;
margin-right: 40px;
height: 1000px;
background: white;
} }
.video-watch{ .video-watch{
min-height: calc(100vh - 104px); min-height: calc(100vh - 104px);
......
vue.config.js
View file @ c6dfd71f
'use strict' "use strict";
const path = require('path') const path = require("path");
function resolve(dir) { function resolve(dir) {
return path.join(__dirname, dir) return path.join(__dirname, dir);
} }
const CompressionPlugin = require('compression-webpack-plugin') const CompressionPlugin = require("compression-webpack-plugin");
const name = process.env.VUE_APP_TITLE || '若依管理系统' // 网页标题 const name = process.env.VUE_APP_TITLE || "若依管理系统"; // 网页标题
const port = process.env.port || process.env.npm_config_port || 80 // 端口 const port = process.env.port || process.env.npm_config_port || 80; // 端口
// vue.config.js 配置说明 // vue.config.js 配置说明
//官方vue.config.js 参考文档 https://cli.vuejs.org/zh/config/#css-loaderoptions //官方vue.config.js 参考文档 https://cli.vuejs.org/zh/config/#css-loaderoptions
...@@ -20,111 +20,110 @@ module.exports = { ...@@ -20,111 +20,110 @@ module.exports = {
// 例如 https://www.ruoyi.vip/。如果应用被部署在一个子路径上，你就需要用这个选项指定这个子路径。例如，如果你的应用被部署在 https://www.ruoyi.vip/admin/，则设置 baseUrl 为 /admin/。 // 例如 https://www.ruoyi.vip/。如果应用被部署在一个子路径上，你就需要用这个选项指定这个子路径。例如，如果你的应用被部署在 https://www.ruoyi.vip/admin/，则设置 baseUrl 为 /admin/。
publicPath: process.env.NODE_ENV === "production" ? "/" : "/", publicPath: process.env.NODE_ENV === "production" ? "/" : "/",
// 在npm run build 或 yarn build 时 ，生成文件的目录名称（要和baseUrl的生产环境路径一致）（默认dist） // 在npm run build 或 yarn build 时 ，生成文件的目录名称（要和baseUrl的生产环境路径一致）（默认dist）
outputDir: 'dist', outputDir: "dist",
// 用于放置生成的静态资源 (js、css、img、fonts) 的；（项目打包之后，静态资源会放在这个文件夹下） // 用于放置生成的静态资源 (js、css、img、fonts) 的；（项目打包之后，静态资源会放在这个文件夹下）
assetsDir: 'static', assetsDir: "static",
// 是否开启eslint保存检测，有效值：ture | false | 'error' // 是否开启eslint保存检测，有效值：ture | false | 'error'
lintOnSave: process.env.NODE_ENV === 'development', lintOnSave: process.env.NODE_ENV === "development",
// 如果你不需要生产环境的 source map，可以将其设置为 false 以加速生产环境构建。 // 如果你不需要生产环境的 source map，可以将其设置为 false 以加速生产环境构建。
productionSourceMap: false, productionSourceMap: false,
// webpack-dev-server 相关配置 // webpack-dev-server 相关配置
devServer: { devServer: {
host: '0.0.0.0', host: "0.0.0.0",
port: port, port: port,
open: true, open: true,
proxy: { proxy: {
// detail: https://cli.vuejs.org/config/#devserver-proxy // detail: https://cli.vuejs.org/config/#devserver-proxy
[process.env.VUE_APP_BASE_API]: { [process.env.VUE_APP_BASE_API]: {
target: `http://127.0.0.1:8087`, target: `http://106.3.99.64:20004`,
changeOrigin: true, changeOrigin: true,
pathRewrite: { pathRewrite: {
['^' + process.env.VUE_APP_BASE_API]: '' ["^" + process.env.VUE_APP_BASE_API]: "",
} },
} },
}, },
disableHostCheck: true disableHostCheck: true,
}, },
css: { css: {
loaderOptions: { loaderOptions: {
sass: { sass: {
sassOptions: { outputStyle: "expanded" } sassOptions: { outputStyle: "expanded" },
} },
} },
}, },
configureWebpack: { configureWebpack: {
name: name, name: name,
resolve: { resolve: {
alias: { alias: {
'@': resolve('src') "@": resolve("src"),
} },
}, },
plugins: [ plugins: [
// http://doc.ruoyi.vip/ruoyi-vue/other/faq.html#使用gzip解压缩静态文件 // http://doc.ruoyi.vip/ruoyi-vue/other/faq.html#使用gzip解压缩静态文件
new CompressionPlugin({ new CompressionPlugin({
cache: false, // 不启用文件缓存 cache: false, // 不启用文件缓存
test: /\.(js|css|html|jpe?g|png|gif|svg)?$/i, // 压缩文件格式 test: /\.(js|css|html|jpe?g|png|gif|svg)?$/i, // 压缩文件格式
filename: '[path][base].gz[query]', // 压缩后的文件名 filename: "[path][base].gz[query]", // 压缩后的文件名
algorithm: 'gzip', // 使用gzip压缩 algorithm: "gzip", // 使用gzip压缩
minRatio: 0.8, // 压缩比例，小于 80% 的文件不会被压缩 minRatio: 0.8, // 压缩比例，小于 80% 的文件不会被压缩
deleteOriginalAssets: false // 压缩后删除原文件 deleteOriginalAssets: false, // 压缩后删除原文件
}) }),
], ],
}, },
chainWebpack(config) { chainWebpack(config) {
config.plugins.delete('preload') // TODO: need test config.plugins.delete("preload"); // TODO: need test
config.plugins.delete('prefetch') // TODO: need test config.plugins.delete("prefetch"); // TODO: need test
// set svg-sprite-loader // set svg-sprite-loader
config.module.rule("svg").exclude.add(resolve("src/assets/icons")).end();
config.module config.module
.rule('svg') .rule("icons")
.exclude.add(resolve('src/assets/icons'))
.end()
config.module
.rule('icons')
.test(/\.svg$/) .test(/\.svg$/)
.include.add(resolve('src/assets/icons')) .include.add(resolve("src/assets/icons"))
.end() .end()
.use('svg-sprite-loader') .use("svg-sprite-loader")
.loader('svg-sprite-loader') .loader("svg-sprite-loader")
.options({ .options({
symbolId: 'icon-[name]' symbolId: "icon-[name]",
}) })
.end() .end();
config.when(process.env.NODE_ENV !== 'development', config => { config.when(process.env.NODE_ENV !== "development", (config) => {
config config
.plugin('ScriptExtHtmlWebpackPlugin') .plugin("ScriptExtHtmlWebpackPlugin")
.after('html') .after("html")
.use('script-ext-html-webpack-plugin', [{ .use("script-ext-html-webpack-plugin", [
{
// `runtime` must same as runtimeChunk name. default is `runtime` // `runtime` must same as runtimeChunk name. default is `runtime`
inline: /runtime\..*\.js$/ inline: /runtime\..*\.js$/,
}]) },
.end() ])
.end();
config.optimization.splitChunks({ config.optimization.splitChunks({
chunks: 'all', chunks: "all",
cacheGroups: { cacheGroups: {
libs: { libs: {
name: 'chunk-libs', name: "chunk-libs",
test: /[\\/]node_modules[\\/]/, test: /[\\/]node_modules[\\/]/,
priority: 10, priority: 10,
chunks: 'initial' // only package third parties that are initially dependent chunks: "initial", // only package third parties that are initially dependent
}, },
elementUI: { elementUI: {
name: 'chunk-elementUI', // split elementUI into a single package name: "chunk-elementUI", // split elementUI into a single package
test: /[\\/]node_modules[\\/]_?element-ui(.*)/, // in order to adapt to cnpm test: /[\\/]node_modules[\\/]_?element-ui(.*)/, // in order to adapt to cnpm
priority: 20 // the weight needs to be larger than libs and app or it will be packaged into libs or app priority: 20, // the weight needs to be larger than libs and app or it will be packaged into libs or app
}, },
commons: { commons: {
name: 'chunk-commons', name: "chunk-commons",
test: resolve('src/components'), // can customize your rules test: resolve("src/components"), // can customize your rules
minChunks: 3, // minimum common number minChunks: 3, // minimum common number
priority: 5, priority: 5,
reuseExistingChunk: true reuseExistingChunk: true,
} },
} },
}) });
config.optimization.runtimeChunk('single') config.optimization.runtimeChunk("single");
}) });
} },
} };
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment