Commit a0ea7efe9c0042b4d7b755270801f94cd32516e8
0 parents
init
Showing
9 changed files
with
324 additions
and
0 deletions
.gitignore
0 → 100644
| 1 | +++ a/.gitignore | |
| 1 | +.DS_Store | |
| 2 | +yarn.lock | |
| 3 | +node_modules | |
| 4 | +package-lock | |
| 5 | +package-lock.json | |
| 6 | +/dist | |
| 7 | +dist.zip | |
| 8 | +/public/font_family | |
| 9 | + | |
| 10 | +# local env files | |
| 11 | +.env.local | |
| 12 | +.env.*.local | |
| 13 | + | |
| 14 | +# Log files | |
| 15 | +npm-debug.log* | |
| 16 | +yarn-debug.log* | |
| 17 | +yarn-error.log* | |
| 18 | +pnpm-debug.log* | |
| 19 | + | |
| 20 | +# Editor directories and files | |
| 21 | +.idea | |
| 22 | +.vscode | |
| 23 | +*.suo | |
| 24 | +*.ntvs* | |
| 25 | +*.njsproj | |
| 26 | +*.sln | |
| 27 | +*.sw? | |
| 28 | +src/views/portrait/test.vue | ... | ... |
.postcssrc.js
0 → 100755
README.md
0 → 100644
| 1 | +++ a/README.md | |
| 1 | +-开发环境 | |
| 2 | +- node.js v8.0+ | |
| 3 | +- git | |
| 4 | + | |
| 5 | +-技术栈 | |
| 6 | +- ES6+ | |
| 7 | +- vue v2.5+ | |
| 8 | +- vue-router | |
| 9 | +- vuex | |
| 10 | +- axios | |
| 11 | +- scss | |
| 12 | +- element-ui v2.4+ | |
| 13 | + | |
| 14 | +- 实现功能 | |
| 15 | + | |
| 16 | +- 登录、退出 | |
| 17 | ++ 基于token | |
| 18 | + - 状态拦截、404页面 | |
| 19 | + - 动态加载路由 | |
| 20 | + - 页面、按钮指令权限管理 | |
| 21 | + - 无限级菜单 | |
| 22 | +- 封装vue-i18n@8.x国际化组件 | |
| 23 | +- 系统全屏化 | |
| 24 | + | |
| 25 | +# 安装依赖 (如果安装失败就多安装几次，实在不行就换淘宝镜像) | |
| 26 | +yarn or yarn install | |
| 27 | +or | |
| 28 | +npm install | |
| 29 | + | |
| 30 | +# 启动项目 (已经配置好启动服务自动打开浏览器，如果没自动打开按照控制台输出的地址自己打开) | |
| 31 | +# 如果eslint语法检查报错，直接关掉eslint语法检查 | |
| 32 | +yarn dev | |
| 33 | +or | |
| 34 | +npm run dev | |
| 35 | + | |
| 36 | +# 启动编译打包 生产环境 | |
| 37 | +yarn build | |
| 38 | +or | |
| 39 | + npm run build | |
| 0 | 40 | \ No newline at end of file | ... | ... |
babel.config.js
0 → 100644
package.json
0 → 100755
| 1 | +++ a/package.json | |
| 1 | +{ | |
| 2 | + "name": "vue-admin", | |
| 3 | + "version": "1.0.0", | |
| 4 | + "private": true, | |
| 5 | + "scripts": { | |
| 6 | + "serve": "vue-cli-service serve", | |
| 7 | + "build": "vue-cli-service build", | |
| 8 | + "lint": "vue-cli-service lint" | |
| 9 | + }, | |
| 10 | + "dependencies": { | |
| 11 | + "core-js": "^3.6.5", | |
| 12 | + "echarts": "5.3.2", | |
| 13 | + "element-ui": "^2.15.1", | |
| 14 | + "js-cookie": "^2.2.0", | |
| 15 | + "jsencrypt": "^3.2.0", | |
| 16 | + "nprogress": "^0.2.0", | |
| 17 | + "font-awesome": "^4.7.0", | |
| 18 | + "vue": "^2.6.11", | |
| 19 | + "vue-i18n": "^8.4.0", | |
| 20 | + "vue-router": "^3.5.1", | |
| 21 | + "axios": "^0.21.1", | |
| 22 | + "vuex": "^3.6.2" | |
| 23 | + }, | |
| 24 | + "devDependencies": { | |
| 25 | + "@vue/cli-plugin-babel": "~4.5.0", | |
| 26 | + "@vue/cli-service": "~4.5.0", | |
| 27 | + "autoprefixer": "^7.1.2", | |
| 28 | + "babel-core": "^6.22.1", | |
| 29 | + "babel-loader": "^7.1.1", | |
| 30 | + "babel-eslint": "^10.1.0", | |
| 31 | + "eslint": "^6.7.2", | |
| 32 | + "eslint-plugin-vue": "^6.2.2", | |
| 33 | + "extract-text-webpack-plugin": "^3.0.0", | |
| 34 | + "html-webpack-plugin": "^4.2.0", | |
| 35 | + "mini-css-extract-plugin": "^0.9.0", | |
| 36 | + "node-sass": "^4.13.0", | |
| 37 | + "sass-loader": "^7.1.0", | |
| 38 | + "postcss-import": "^12.0.1", | |
| 39 | + "postcss-loader": "^3.0.0", | |
| 40 | + "postcss-url": "^7.2.1", | |
| 41 | + "optimize-css-assets-webpack-plugin": "^3.2.0", | |
| 42 | + "vue-template-compiler": "^2.5.2" | |
| 43 | + } | |
| 44 | +} | ... | ... |
public/index.html
0 → 100644
| 1 | +++ a/public/index.html | |
| 1 | +<!DOCTYPE html> | |
| 2 | +<html lang=""> | |
| 3 | + | |
| 4 | +<head> | |
| 5 | + <meta charset="utf-8"> | |
| 6 | + <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> | |
| 7 | + <meta name="viewport" content="width=device-width,initial-scale=1.0"> | |
| 8 | + <link rel="icon" href="<%= BASE_URL %>favicon.ico"> | |
| 9 | + <title> | |
| 10 | + <%= htmlWebpackPlugin.options.title %> | |
| 11 | + </title> | |
| 12 | +</head> | |
| 13 | + | |
| 14 | +<body> | |
| 15 | + <noscript> | |
| 16 | + <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. | |
| 17 | + Please enable it to continue.</strong> | |
| 18 | + </noscript> | |
| 19 | + <div id="app"></div> | |
| 20 | + <!-- built files will be auto injected --> | |
| 21 | +</body> | |
| 22 | + | |
| 23 | +</html> | |
| 0 | 24 | \ No newline at end of file | ... | ... |
src/App.vue
0 → 100644
| 1 | +++ a/src/App.vue | |
| 1 | +<template> | |
| 2 | + <div id="app"> | |
| 3 | + <transition name="fade" mode="out-in"> | |
| 4 | + <router-view></router-view> | |
| 5 | + </transition> | |
| 6 | + </div> | |
| 7 | +</template> | |
| 8 | + | |
| 9 | +<script> | |
| 10 | +export default { | |
| 11 | + name: "app" | |
| 12 | +} | |
| 13 | + | |
| 14 | +</script> | |
| 15 | + | |
| 16 | +<style lang="scss"> | |
| 17 | +body { | |
| 18 | + margin: 0px; | |
| 19 | + padding: 0px; | |
| 20 | + font-family: Microsoft YaHei, Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, SimSun, sans-serif; | |
| 21 | + font-size: 14px; | |
| 22 | + -webkit-font-smoothing: antialiased; | |
| 23 | +} | |
| 24 | + | |
| 25 | +#app { | |
| 26 | + position: absolute; | |
| 27 | + top: 0px; | |
| 28 | + bottom: 0px; | |
| 29 | + width: 100%; | |
| 30 | +} | |
| 31 | +a{ | |
| 32 | + color: #56a9ff; | |
| 33 | +} | |
| 34 | +.fade-enter-active, | |
| 35 | +.fade-leave-active { | |
| 36 | + transition: all .2s ease; | |
| 37 | +} | |
| 38 | + | |
| 39 | +.fade-enter, | |
| 40 | +.fade-leave-active { | |
| 41 | + opacity: 0; | |
| 42 | +} | |
| 43 | +#nprogress .bar { | |
| 44 | + height: 3px !important; | |
| 45 | + background: #56a9ff !important; //自定义颜色 | |
| 46 | +} | |
| 47 | +</style> | ... | ... |
src/main.js
0 → 100755
| 1 | +++ a/src/main.js | |
| 1 | +// The Vue build version to load with the `import` command | |
| 2 | +// (runtime-only or standalone) has been set in webpack.base.conf with an alias. | |
| 3 | +import Vue from "vue" | |
| 4 | +import ElementUI from "element-ui" | |
| 5 | +import App from "./App.vue" | |
| 6 | +import router from "./router" | |
| 7 | +import store from "./store" | |
| 8 | +import i18n from "./i18n/i18n" | |
| 9 | +import globalPlugin from "./utils/global" | |
| 10 | +import permission from "./directive/permission/button" | |
| 11 | +import NProgress from "nprogress" | |
| 12 | + | |
| 13 | +import "nprogress/nprogress.css" | |
| 14 | +import "element-ui/lib/theme-chalk/index.css" | |
| 15 | +import "font-awesome/css/font-awesome.css" | |
| 16 | +import "@/router/permission" | |
| 17 | + | |
| 18 | +Vue.config.productionTip = false | |
| 19 | +Vue.use(ElementUI) | |
| 20 | +Vue.use(globalPlugin) | |
| 21 | +Vue.use(permission) | |
| 22 | + | |
| 23 | +NProgress.inc(0.2) | |
| 24 | +NProgress.configure({ easing: "ease", speed: 500, showSpinner: false }) | |
| 25 | + | |
| 26 | +/* eslint-disable no-new */ | |
| 27 | +new Vue({ | |
| 28 | + el: "#app", | |
| 29 | + router, | |
| 30 | + store, | |
| 31 | + i18n, | |
| 32 | + render: h => h(App), | |
| 33 | + components: {App}, | |
| 34 | + template: "<App/>" | |
| 35 | +}) | ... | ... |
vue.config.js
0 → 100644
| 1 | +++ a/vue.config.js | |
| 1 | +const path = require("path"); | |
| 2 | +const resolve = (dir) => path.join(__dirname, dir); | |
| 3 | +const IS_PROD = ["production", "prod"].includes(process.env.NODE_ENV); | |
| 4 | +const BundleAnalyzerPlugin = require("webpack-bundle-analyzer") | |
| 5 | + .BundleAnalyzerPlugin; | |
| 6 | + | |
| 7 | +module.exports = { | |
| 8 | + publicPath: "./", // 编译后的地址，可以根据环境进行设置 | |
| 9 | + outputDir: "dist", // 生产环境构建文件的目录 | |
| 10 | + assetsDir: "static", // 静态文件目录 | |
| 11 | + lintOnSave: false, //是否开启编译时是否不符合eslint提示 | |
| 12 | + productionSourceMap: false, // 如果你不需要生产环境的 source map，可以将其设置为 false 以加速生产环境构建。 | |
| 13 | + devServer: { | |
| 14 | + hot:true, | |
| 15 | + port: 8080, // 端口 | |
| 16 | + open: false, // 启动后打开浏览器 | |
| 17 | + compress: true, | |
| 18 | + overlay: { | |
| 19 | + // 当出现编译器错误或警告时，在浏览器中显示全屏覆盖层 | |
| 20 | + warnings: false, | |
| 21 | + errors: true, | |
| 22 | + }, | |
| 23 | + proxy: { | |
| 24 | + "/": { | |
| 25 | + target:"http://lead.xc.com:32269", | |
| 26 | + changeOrigin: true, | |
| 27 | + ws:true, | |
| 28 | + }, | |
| 29 | + }, | |
| 30 | + disableHostCheck: true | |
| 31 | + }, | |
| 32 | + css: { | |
| 33 | + extract: IS_PROD, // 是否将组件中的 CSS 提取至一个独立的 CSS 文件中 (而不是动态注入到 JavaScript 中的 inline 代码)。 | |
| 34 | + sourceMap: false, | |
| 35 | + }, | |
| 36 | + chainWebpack: (config) => { | |
| 37 | + config.plugin('html').tap(args => { | |
| 38 | + args[0].title = '云平台'; | |
| 39 | + return args; | |
| 40 | + }); | |
| 41 | + config.resolve.alias | |
| 42 | + .set("@", resolve("src")) | |
| 43 | + .set("assets", resolve("src/assets")) | |
| 44 | + .set("components", resolve("src/components")) | |
| 45 | + .set("router", resolve("src/router")) | |
| 46 | + .set("utils", resolve("src/utils")) | |
| 47 | + .set("store", resolve("src/store")) | |
| 48 | + .set("views", resolve("src/views")) | |
| 49 | + .set("api", resolve("src/api")); | |
| 50 | + if (IS_PROD) { | |
| 51 | + config.plugin("webpack-report").use(BundleAnalyzerPlugin, [ | |
| 52 | + { | |
| 53 | + analyzerMode: "static", | |
| 54 | + }, | |
| 55 | + ]); | |
| 56 | + } | |
| 57 | + config.when(IS_PROD, (config) => { | |
| 58 | + config.devtool("cheap-source-map"); | |
| 59 | + config | |
| 60 | + .plugin("ScriptExtHtmlWebpackPlugin") | |
| 61 | + .after("html") | |
| 62 | + .use("script-ext-html-webpack-plugin") | |
| 63 | + .end(); | |
| 64 | + config.optimization.splitChunks({ | |
| 65 | + chunks: "all", | |
| 66 | + cacheGroups: { | |
| 67 | + // cacheGroups 下可以可以配置多个组，每个组根据test设置条件，符合test条件的模块 | |
| 68 | + commons: { | |
| 69 | + name: "chunk-commons", | |
| 70 | + test: resolve("src/components"), | |
| 71 | + minChunks: 3, // 被至少用三次以上打包分离 | |
| 72 | + priority: 5, // 优先级 | |
| 73 | + reuseExistingChunk: true, // 表示是否使用已有的 chunk，如果为 true 则表示如果当前的 chunk 包含的模块已经被抽取出去了，那么将不会重新生成新的。 | |
| 74 | + }, | |
| 75 | + node_vendors: { | |
| 76 | + name: "chunk-libs", | |
| 77 | + chunks: "initial", // 只打包初始时依赖的第三方 | |
| 78 | + test: /[\\/]node_modules[\\/]/, | |
| 79 | + priority: 10, | |
| 80 | + }, | |
| 81 | + elementUI: { | |
| 82 | + name: "chunk-elementUI", // 单独将 elementUI 拆包 | |
| 83 | + priority: 20, // 数字大权重到，满足多个 cacheGroups 的条件时候分到权重高的 | |
| 84 | + test: /[\\/]node_modules[\\/]_?element(.*)/, | |
| 85 | + }, | |
| 86 | + }, | |
| 87 | + }); | |
| 88 | + config.optimization.runtimeChunk("single"); | |
| 89 | + config.optimization.minimize(true); | |
| 90 | + }); | |
| 91 | + }, | |
| 92 | +}; | |
| 93 | + | ... | ... |