From 751095b87a61d4d5527d85d9b90d7ed44bcd023d Mon Sep 17 00:00:00 2001 From: xycccch Date: Tue, 11 Jan 2022 11:43:15 +0800 Subject: [PATCH 01/10] =?UTF-8?q?=E5=B0=86vue-cil=E8=BD=AC=E4=B8=BAvite?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .env.development | 5 -- .env.production | 6 -- .env.staging | 8 --- build/index.js | 35 ---------- favicon.ico | Bin 0 -> 67646 bytes index.html | 17 +++++ mock/index.js | 12 ++-- mock/mock-server.js | 2 +- mock/table.js | 4 +- mock/user.js | 2 +- mock/utils.js | 2 +- package.json | 26 +++----- public/index.html | 2 +- src/components/SvgIcon/index.vue | 62 ------------------ src/icons/index.js | 25 +++++-- src/icons/svg/dashboard.svg | 1 - src/icons/svg/example.svg | 1 - src/icons/svg/eye-open.svg | 1 - src/icons/svg/eye.svg | 1 - src/icons/svg/form.svg | 1 - src/icons/svg/link.svg | 1 - src/icons/svg/nested.svg | 1 - src/icons/svg/password.svg | 1 - src/icons/svg/table.svg | 1 - src/icons/svg/tree.svg | 1 - src/icons/svg/user.svg | 1 - src/layout/components/Navbar.vue | 15 +++-- src/layout/components/Sidebar/Item.vue | 46 ++++++++----- src/layout/components/Sidebar/SidebarItem.vue | 2 +- src/layout/components/Sidebar/index.vue | 15 +++-- src/layout/index.vue | 4 +- src/main.js | 8 +-- src/router/index.js | 12 ++-- src/settings.js | 2 +- src/utils/request.js | 2 +- src/views/login/index.vue | 6 +- vite.config.js | 31 +++++++++ 37 files changed, 153 insertions(+), 209 deletions(-) delete mode 100644 .env.development delete mode 100644 .env.production delete mode 100644 .env.staging delete mode 100644 build/index.js create mode 100644 favicon.ico create mode 100644 index.html delete mode 100644 src/components/SvgIcon/index.vue delete mode 100644 src/icons/svg/dashboard.svg delete mode 100644 src/icons/svg/example.svg delete mode 100644 src/icons/svg/eye-open.svg delete mode 100644 src/icons/svg/eye.svg delete mode 100644 src/icons/svg/form.svg delete mode 100644 src/icons/svg/link.svg delete mode 100644 src/icons/svg/nested.svg delete mode 100644 src/icons/svg/password.svg delete mode 100644 src/icons/svg/table.svg delete mode 100644 src/icons/svg/tree.svg delete mode 100644 src/icons/svg/user.svg create mode 100644 vite.config.js diff --git a/.env.development b/.env.development deleted file mode 100644 index de583d0..0000000 --- a/.env.development +++ /dev/null @@ -1,5 +0,0 @@ -# just a flag -ENV = 'development' - -# base api -VUE_APP_BASE_API = '/dev-api' diff --git a/.env.production b/.env.production deleted file mode 100644 index 80c8103..0000000 --- a/.env.production +++ /dev/null @@ -1,6 +0,0 @@ -# just a flag -ENV = 'production' - -# base api -VUE_APP_BASE_API = '/prod-api' - diff --git a/.env.staging b/.env.staging deleted file mode 100644 index a8793a0..0000000 --- a/.env.staging +++ /dev/null @@ -1,8 +0,0 @@ -NODE_ENV = production - -# just a flag -ENV = 'staging' - -# base api -VUE_APP_BASE_API = '/stage-api' - diff --git a/build/index.js b/build/index.js deleted file mode 100644 index 0c57de2..0000000 --- a/build/index.js +++ /dev/null @@ -1,35 +0,0 @@ -const { run } = require('runjs') -const chalk = require('chalk') -const config = require('../vue.config.js') -const rawArgv = process.argv.slice(2) -const args = rawArgv.join(' ') - -if (process.env.npm_config_preview || rawArgv.includes('--preview')) { - const report = rawArgv.includes('--report') - - run(`vue-cli-service build ${args}`) - - const port = 9526 - const publicPath = config.publicPath - - var connect = require('connect') - var serveStatic = require('serve-static') - const app = connect() - - app.use( - publicPath, - serveStatic('./dist', { - index: ['index.html', '/'] - }) - ) - - app.listen(port, function () { - console.log(chalk.green(`> Preview at http://localhost:${port}${publicPath}`)) - if (report) { - console.log(chalk.green(`> Report at http://localhost:${port}${publicPath}report.html`)) - } - - }) -} else { - run(`vue-cli-service build ${args}`) -} diff --git a/favicon.ico b/favicon.ico new file mode 100644 index 0000000000000000000000000000000000000000..34b63ac63a87ee3ea8e7a0f3f5b5406c437e2112 GIT binary patch literal 67646 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 X;@D+E7Ad=S_FbjlW&KY_+xPzm3MBT? literal 0 HcmV?d00001 diff --git a/index.html b/index.html new file mode 100644 index 0000000..053ad2e --- /dev/null +++ b/index.html @@ -0,0 +1,17 @@ + + + + + + + + + + + +
+ + + diff --git a/mock/index.js b/mock/index.js index c514c13..b959299 100644 --- a/mock/index.js +++ b/mock/index.js @@ -1,8 +1,8 @@ -const Mock = require('mockjs') -const { param2Obj } = require('./utils') +import Mock from 'mockjs' +import utils from './utils' -const user = require('./user') -const table = require('./table') +import user from './user' +import table from './table' const mocks = [ ...user, @@ -36,7 +36,7 @@ function mockXHR() { result = respond({ method: type, body: JSON.parse(body), - query: param2Obj(url) + query: utils.param2Obj(url) }) } else { result = respond @@ -50,7 +50,7 @@ function mockXHR() { } } -module.exports = { +export default { mocks, mockXHR } diff --git a/mock/mock-server.js b/mock/mock-server.js index 8941ec0..f7411a4 100644 --- a/mock/mock-server.js +++ b/mock/mock-server.js @@ -34,7 +34,7 @@ function unregisterRoutes() { // for mock server const responseFake = (url, type, respond) => { return { - url: new RegExp(`${process.env.VUE_APP_BASE_API}${url}`), + url: new RegExp(`${import.meta.env.VUE_APP_BASE_API}${url}`), type: type || 'get', response(req, res) { console.log('request invoke:' + req.path) diff --git a/mock/table.js b/mock/table.js index bd0e013..ba95f76 100644 --- a/mock/table.js +++ b/mock/table.js @@ -1,4 +1,4 @@ -const Mock = require('mockjs') +import Mock from 'mockjs' const data = Mock.mock({ 'items|30': [{ @@ -11,7 +11,7 @@ const data = Mock.mock({ }] }) -module.exports = [ +export default [ { url: '/vue-admin-template/table/list', type: 'get', diff --git a/mock/user.js b/mock/user.js index 7555338..f007cd9 100644 --- a/mock/user.js +++ b/mock/user.js @@ -23,7 +23,7 @@ const users = { } } -module.exports = [ +export default [ // user login { url: '/vue-admin-template/user/login', diff --git a/mock/utils.js b/mock/utils.js index 95cc27d..3f958d8 100644 --- a/mock/utils.js +++ b/mock/utils.js @@ -20,6 +20,6 @@ function param2Obj(url) { return obj } -module.exports = { +export default { param2Obj } diff --git a/package.json b/package.json index 2413824..1fd5bb0 100644 --- a/package.json +++ b/package.json @@ -1,20 +1,18 @@ { "name": "vue-admin-template", "version": "4.4.0", - "description": "A vue admin template with Element UI & axios & iconfont & permission control & lint", - "author": "Pan ", + "description": "A vue admin template with Element UI & axios & vite & permission control & lint", + "author": "Xydawn ", "scripts": { - "dev": "vue-cli-service serve", - "build:prod": "vue-cli-service build", - "build:stage": "vue-cli-service build --mode staging", - "preview": "node build/index.js --preview", - "svgo": "svgo -f src/icons/svg --config=src/icons/svgo.yml", + "dev": "vite", + "build": "vite build", + "preview": "vite preview", "lint": "eslint --ext .js,.vue src", "test:unit": "jest --clearCache && vue-cli-service test:unit", "test:ci": "npm run lint && npm run test:unit" }, "dependencies": { - "axios": "0.18.1", + "axios": "^0.18.1", "core-js": "3.6.5", "element-ui": "2.13.2", "js-cookie": "2.2.0", @@ -26,11 +24,7 @@ "vuex": "3.1.0" }, "devDependencies": { - "@vue/cli-plugin-babel": "4.4.4", - "@vue/cli-plugin-eslint": "4.4.4", - "@vue/cli-plugin-unit-jest": "4.4.4", - "@vue/cli-service": "4.4.4", - "@vue/test-utils": "1.0.0-beta.29", + "@vue/compiler-sfc": "^3.2.26", "autoprefixer": "9.5.1", "babel-eslint": "10.1.0", "babel-jest": "23.6.0", @@ -46,8 +40,8 @@ "sass-loader": "8.0.2", "script-ext-html-webpack-plugin": "2.1.3", "serve-static": "1.13.2", - "svg-sprite-loader": "4.1.3", - "svgo": "1.2.2", + "vite": "^2.7.10", + "vite-plugin-vue2": "^1.9.2", "vue-template-compiler": "2.6.10" }, "browserslist": [ @@ -59,4 +53,4 @@ "npm": ">= 3.0.0" }, "license": "MIT" -} +} \ No newline at end of file diff --git a/public/index.html b/public/index.html index fa2be91..d3e56e6 100644 --- a/public/index.html +++ b/public/index.html @@ -4,7 +4,7 @@ - + <%= webpackConfig.name %> diff --git a/src/components/SvgIcon/index.vue b/src/components/SvgIcon/index.vue deleted file mode 100644 index b07ded2..0000000 --- a/src/components/SvgIcon/index.vue +++ /dev/null @@ -1,62 +0,0 @@ - - - - - diff --git a/src/icons/index.js b/src/icons/index.js index 2c6b309..be14ca3 100644 --- a/src/icons/index.js +++ b/src/icons/index.js @@ -1,9 +1,20 @@ -import Vue from 'vue' -import SvgIcon from '@/components/SvgIcon'// svg component +// import Vue from 'vue' +// import SvgIcon from '@/components/SvgIcon'// svg component -// register globally -Vue.component('svg-icon', SvgIcon) +// // register globally +// Vue.component('svg-icon', SvgIcon) -const req = require.context('./svg', false, /\.svg$/) -const requireAll = requireContext => requireContext.keys().map(requireContext) -requireAll(req) +// // const req = require.context('./svg', false, /\.svg$/) +// const modules = import.meta.globEager('./svg/*.svg') +// const requireAll = requireContext => { +// debugger +// Object.keys(requireContext).map(requireContext) +// } +// requireAll(modules) + +// for (const path in modules) { +// debugger +// modules[path]().then((mod) => { +// console.log(path, mod) +// }) +// } diff --git a/src/icons/svg/dashboard.svg b/src/icons/svg/dashboard.svg deleted file mode 100644 index 5317d37..0000000 --- a/src/icons/svg/dashboard.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/src/icons/svg/example.svg b/src/icons/svg/example.svg deleted file mode 100644 index 46f42b5..0000000 --- a/src/icons/svg/example.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/src/icons/svg/eye-open.svg b/src/icons/svg/eye-open.svg deleted file mode 100644 index 88dcc98..0000000 --- a/src/icons/svg/eye-open.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/src/icons/svg/eye.svg b/src/icons/svg/eye.svg deleted file mode 100644 index 16ed2d8..0000000 --- a/src/icons/svg/eye.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/src/icons/svg/form.svg b/src/icons/svg/form.svg deleted file mode 100644 index dcbaa18..0000000 --- a/src/icons/svg/form.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/src/icons/svg/link.svg b/src/icons/svg/link.svg deleted file mode 100644 index 48197ba..0000000 --- a/src/icons/svg/link.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/src/icons/svg/nested.svg b/src/icons/svg/nested.svg deleted file mode 100644 index 06713a8..0000000 --- a/src/icons/svg/nested.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/src/icons/svg/password.svg b/src/icons/svg/password.svg deleted file mode 100644 index e291d85..0000000 --- a/src/icons/svg/password.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/src/icons/svg/table.svg b/src/icons/svg/table.svg deleted file mode 100644 index 0e3dc9d..0000000 --- a/src/icons/svg/table.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/src/icons/svg/tree.svg b/src/icons/svg/tree.svg deleted file mode 100644 index dd4b7dd..0000000 --- a/src/icons/svg/tree.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/src/icons/svg/user.svg b/src/icons/svg/user.svg deleted file mode 100644 index 0ba0716..0000000 --- a/src/icons/svg/user.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/src/layout/components/Navbar.vue b/src/layout/components/Navbar.vue index 0ca5cf6..a95a5a2 100644 --- a/src/layout/components/Navbar.vue +++ b/src/layout/components/Navbar.vue @@ -7,7 +7,8 @@
- + +
@@ -118,12 +119,12 @@ export default { margin-top: 5px; position: relative; - .user-avatar { - cursor: pointer; - width: 40px; - height: 40px; - border-radius: 10px; - } + // .user-avatar { + // cursor: pointer; + // width: 40px; + // height: 40px; + // border-radius: 10px; + // } .el-icon-caret-bottom { cursor: pointer; diff --git a/src/layout/components/Sidebar/Item.vue b/src/layout/components/Sidebar/Item.vue index aa1f5da..bd20e59 100644 --- a/src/layout/components/Sidebar/Item.vue +++ b/src/layout/components/Sidebar/Item.vue @@ -1,7 +1,17 @@ + diff --git a/src/layout/components/Sidebar/SidebarItem.vue b/src/layout/components/Sidebar/SidebarItem.vue index a418c3d..f3adf9b 100644 --- a/src/layout/components/Sidebar/SidebarItem.vue +++ b/src/layout/components/Sidebar/SidebarItem.vue @@ -25,7 +25,7 @@ diff --git a/src/icons/index.js b/src/icons/index.js index be14ca3..4818de6 100644 --- a/src/icons/index.js +++ b/src/icons/index.js @@ -1,20 +1,7 @@ -// import Vue from 'vue' -// import SvgIcon from '@/components/SvgIcon'// svg component +import Vue from 'vue'; +import SvgIcon from '@/components/SvgIcon'; // svg component -// // register globally -// Vue.component('svg-icon', SvgIcon) +// register globally +Vue.component('svg-icon', SvgIcon); -// // const req = require.context('./svg', false, /\.svg$/) -// const modules = import.meta.globEager('./svg/*.svg') -// const requireAll = requireContext => { -// debugger -// Object.keys(requireContext).map(requireContext) -// } -// requireAll(modules) - -// for (const path in modules) { -// debugger -// modules[path]().then((mod) => { -// console.log(path, mod) -// }) -// } +const req = import.meta.globEager('./svg/*.svg'); // vite diff --git a/src/icons/svg/dashboard.svg b/src/icons/svg/dashboard.svg new file mode 100644 index 0000000..5317d37 --- /dev/null +++ b/src/icons/svg/dashboard.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/example.svg b/src/icons/svg/example.svg new file mode 100644 index 0000000..46f42b5 --- /dev/null +++ b/src/icons/svg/example.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/eye-open.svg b/src/icons/svg/eye-open.svg new file mode 100644 index 0000000..88dcc98 --- /dev/null +++ b/src/icons/svg/eye-open.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/eye.svg b/src/icons/svg/eye.svg new file mode 100644 index 0000000..16ed2d8 --- /dev/null +++ b/src/icons/svg/eye.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/form.svg b/src/icons/svg/form.svg new file mode 100644 index 0000000..dcbaa18 --- /dev/null +++ b/src/icons/svg/form.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/link.svg b/src/icons/svg/link.svg new file mode 100644 index 0000000..48197ba --- /dev/null +++ b/src/icons/svg/link.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/nested.svg b/src/icons/svg/nested.svg new file mode 100644 index 0000000..06713a8 --- /dev/null +++ b/src/icons/svg/nested.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/password.svg b/src/icons/svg/password.svg new file mode 100644 index 0000000..e291d85 --- /dev/null +++ b/src/icons/svg/password.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/table.svg b/src/icons/svg/table.svg new file mode 100644 index 0000000..0e3dc9d --- /dev/null +++ b/src/icons/svg/table.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/tree.svg b/src/icons/svg/tree.svg new file mode 100644 index 0000000..dd4b7dd --- /dev/null +++ b/src/icons/svg/tree.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/user.svg b/src/icons/svg/user.svg new file mode 100644 index 0000000..0ba0716 --- /dev/null +++ b/src/icons/svg/user.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/plugins/svgBuilder.js b/src/plugins/svgBuilder.js new file mode 100644 index 0000000..1431e4f --- /dev/null +++ b/src/plugins/svgBuilder.js @@ -0,0 +1,74 @@ +import { readFileSync, readdirSync } from 'fs' + +let idPerfix = '' +const svgTitle = /+].*?)>/ +const clearHeightWidth = /(width|height)="([^>+].*?)"/g + +const hasViewBox = /(viewBox="[^>+].*?")/g + +const clearReturn = /(\r)|(\n)/g + +function findSvgFile(dir) { + const svgRes = [] + const dirents = readdirSync(dir, { + withFileTypes: true + }) + for (const dirent of dirents) { + if (dirent.isDirectory()) { + svgRes.push(...findSvgFile(dir + dirent.name + '/')) + } else { + const svg = readFileSync(dir + dirent.name) + .toString() + .replace(clearReturn, '') + .replace(svgTitle, ($1, $2) => { + // console.log(++i) + // console.log(dirent.name) + let width = 0 + let height = 0 + let content = $2.replace( + clearHeightWidth, + (s1, s2, s3) => { + if (s2 === 'width') { + width = s3 + } else if (s2 === 'height') { + height = s3 + } + return '' + } + ) + if (!hasViewBox.test($2)) { + content += `viewBox="0 0 ${width} ${height}"` + } + return `` + }) + .replace('', '') + svgRes.push(svg) + } + } + return svgRes +} + +export const svgBuilder = (path, perfix = 'icon') => { + if (path === '') return + idPerfix = perfix + const res = findSvgFile(path) + // console.log(res.length) + // const res = [] + return { + name: 'svg-transform', + transformIndexHtml(html) { + return html.replace( + '', + ` + + + ${res.join('')} + + ` + ) + } + } +} diff --git a/src/views/login/index.vue b/src/views/login/index.vue index c91d3ea..1db2464 100644 --- a/src/views/login/index.vue +++ b/src/views/login/index.vue @@ -8,7 +8,7 @@ - + - + - + diff --git a/vite.config.js b/vite.config.js index 7c25427..a6890fe 100644 --- a/vite.config.js +++ b/vite.config.js @@ -2,7 +2,7 @@ import { defineConfig } from 'vite' import { createVuePlugin } from 'vite-plugin-vue2' import { resolve } from 'path' import viteSvgIcons from 'vite-plugin-svg-icons' - +import { svgBuilder } from './src/plugins/svgBuilder'; // vite.config.js export default defineConfig({ esbuild: { @@ -10,6 +10,7 @@ export default defineConfig({ jsxFragment: 'Fragment' }, plugins: [ + svgBuilder('./src/icons/svg/'), viteSvgIcons({ // 指定需要缓存的图标文件夹 iconDirs: [resolve(process.cwd(), 'src/icons/svg')], From f798ebe2b9f89b7c9fb86ab29ebb6968edf5e366 Mon Sep 17 00:00:00 2001 From: Xydawn Date: Wed, 12 Jan 2022 10:48:07 +0800 Subject: [PATCH 07/10] =?UTF-8?q?=E4=BF=AE=E6=94=B9title=E5=81=8F=E7=A7=BB?= =?UTF-8?q?=E7=9A=84=E9=97=AE=E9=A2=98=E3=80=82?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/layout/components/Sidebar/Item.vue | 10 ++++++---- src/router/index.js | 12 ++++++------ src/styles/sidebar.scss | 17 ++++++++--------- 3 files changed, 20 insertions(+), 19 deletions(-) diff --git a/src/layout/components/Sidebar/Item.vue b/src/layout/components/Sidebar/Item.vue index bd20e59..ff1685b 100644 --- a/src/layout/components/Sidebar/Item.vue +++ b/src/layout/components/Sidebar/Item.vue @@ -1,13 +1,15 @@