Commit e632b89e authored by Step_by_step's avatar Step_by_step

feat: 使用vite

parent 88b79248
> 1%
last 2 versions
not dead
not ie 11
\ No newline at end of file
VUE_APP_DEBUG='true'
VUE_APP_BASE_URL='/'
VUE_APP_HTTP_TIMEOUT=50000
VUE_APP_PAGE_SIZE=10
VITE_DEBUG='true'
VITE_BASE_URL='/'
VITE_HTTP_TIMEOUT=50000
VITE_PAGE_SIZE=10
NODE_ENV='development'
VUE_APP_DEBUG='true'
VUE_APP_HTTP_HEADER={}
VUE_APP_HTTP_BASE_URL='http://192.168.101.1:28080'
VUE_APP_HTTP_NOAUTH_BASE_URL=''
VITE_DEBUG='true'
VITE_HTTP_HEADER={}
VITE_HTTP_BASE_URL='http://192.168.101.1:28080'
VITE_HTTP_NOAUTH_BASE_URL=''
NODE_ENV='production'
VUE_APP_DEBUG='false'
VUE_APP_HTTP_HEADER={}
VUE_APP_HTTP_BASE_URL='https://yw.fshsfl.com/api'
VUE_APP_HTTP_NOAUTH_BASE_URL=''
VITE_DEBUG='false'
VITE_HTTP_HEADER={}
VITE_HTTP_BASE_URL='https://yw.fshsfl.com/api'
VITE_HTTP_NOAUTH_BASE_URL=''
NODE_ENV='testing'
VUE_APP_DEBUG='true'
VUE_APP_HTTP_HEADER={}
VUE_APP_HTTP_BASE_URL='http://192.168.101.1:8001'
VUE_APP_HTTP_NOAUTH_BASE_URL=''
\ No newline at end of file
VITE_DEBUG='true'
VITE_HTTP_HEADER={}
VITE_HTTP_BASE_URL='http://192.168.101.1:8001'
VITE_HTTP_NOAUTH_BASE_URL=''
\ No newline at end of file
module.exports = {
root: true,
env: {
node: true
},
'extends': [
'plugin:vue/vue3-essential',
'eslint:recommended'
],
parserOptions: {
parser: '@babel/eslint-parser'
},
rules: {
'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off'
}
}
.DS_Store
node_modules
/dist
# local env files
.env.local
.env.*.local
# Log files
# Logs
logs
*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*
pnpm-debug.log*
lerna-debug.log*
node_modules
.DS_Store
dist
dist-ssr
coverage
*.local
/cypress/videos/
/cypress/screenshots/
# Editor directories and files
.vscode/*
!.vscode/extensions.json
.idea
.vscode
*.suo
*.ntvs*
*.njsproj
......
// https://github.com/michael-ciniawsky/postcss-load-config
module.exports = {
plugins: {
"postcss-import": {},
"postcss-url": {},
"postcss-aspect-ratio-mini": {},
// "postcss-cssnext": {},
"postcss-px-to-viewport": {
viewportWidth: 375,
viewportHeight: 667,
unitPrecision: 3,
viewportUnit: "vw",
selectorBlackList: [".ignore", ".hairlines"],
minPixelValue: 3,
mediaQuery: false
},
cssnano: {
autoprefixer: false,
"postcss-zindex": false
}
}
};
{
"recommendations": ["Vue.volar", "Vue.vscode-typescript-vue-plugin"]
}
# vue3-project
# vuen
## Project setup
This template should help get you started developing with Vue 3 in Vite.
```
yarn install
```
### Compiles and hot-reloads for development
## Recommended IDE Setup
```
yarn serve
```
[VSCode](https://code.visualstudio.com/) + [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) (and disable Vetur) + [TypeScript Vue Plugin (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin).
### Compiles and minifies for production
## Customize configuration
```
yarn build
```
See [Vite Configuration Reference](https://vitejs.dev/config/).
### Lints and fixes files
## Project Setup
```sh
npm install
```
yarn lint
```
### Customize configuration
See [Configuration Reference](https://cli.vuejs.org/config/).
---
### Compile and Hot-Reload for Development
### 添加模块?
1. modules内创建新的模块
> 如果想要在首页看到该页面,配置页面时在 meta 中配置 title
2. modules/index 配置模块名称
3. packages.json 中配置相应的打包脚本
---
### 子应用
1. 融资计算器
2. 融资意向
3. 项目查询
4. 合同签约 (E签宝, 预览签署文件)
5. 还款计划 (支付)
6. 还款计划查询 (发票预览下载)
7. 自助服务
8. 客户信息变更
#### 导航
- 首页
- 消息 (消息通知)
- 我的
#### 首页
1. 还款情况展示
2. 最近消息展板
3. 定位
```sh
npm run dev
```
#### 我的
### Compile and Minify for Production
1. 我的奖励券
2. 关联项目
3. 投诉与建议
4. 关于我们
5. 退出登录
```sh
npm run build
```
module.exports = {
presets: [
// '@vue/cli-plugin-babel/preset'
[
'@vue/app',
{
useBuiltIns: 'entry',
polyfills: [
'es6.promise', // 安装的依赖
'es.symbol'
],
corejs: 3
}
]
],
plugins: [
[
'import', {
libraryName: 'vant',
libraryDirectory: 'es',
style: true
},
'vant'
],
]
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link rel="icon" href="/favicon.ico">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Vite App</title>
</head>
<body>
<div id="app"></div>
<script type="module" src="/src/main.js"></script>
</body>
</html>
{
"compilerOptions": {
"target": "es5",
"module": "esnext",
"baseUrl": "./",
"moduleResolution": "node",
"paths": {
"@/*": [
"src/*"
]
},
"lib": [
"esnext",
"dom",
"dom.iterable",
"scripthost"
]
}
}
{
"name": "komatsu-lease-app",
"version": "0.1.0",
"private": true,
"name": "vuen",
"version": "0.0.0",
"scripts": {
"serve": "cross-env VUE_APP_ENV=local VUE_APP_TARGET=schedule vue-cli-service serve",
"dev": "cross-env VUE_APP_ENV=local vue-cli-service serve",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint",
"build:customer_manage:dev": "cross-env VUE_APP_ENV=development VUE_APP_TARGET=customer_manage vue-cli-service build --mode development --dest dist/dev/customer_manage",
"build:customer_manage:test": "cross-env VUE_APP_ENV=testing VUE_APP_TARGET=customer_manage vue-cli-service build --mode testing --dest dist/test/customer_manage"
"dev": "VITE_TARGET=ALL vite ",
"build": "vite build"
},
"browserSlist": [
"> 1%",
"last 2 versions"
],
"dependencies": {
"@hips/plugin-vue-jssdk": "^1.1.2",
"@vueuse/core": "^8.5.0",
"axios": "^0.27.2",
"babel-plugin-import": "^1.13.5",
"babel-polyfill": "^6.26.0",
"core-js": "^3.8.3",
"es6-promise": "^4.2.8",
"moment": "^2.29.3",
"postcss": "^8.2.15",
"uuid": "^8.3.2",
"vant": "^3.5.0",
"vconsole": "^3.14.6",
"vue": "^3.2.13",
"vue-router": "^4.0.3",
"vuex": "^4.0.0"
"axios": "^1.2.0",
"moment": "^2.29.4",
"pinia": "^2.0.23",
"postcss-px-to-viewport": "^1.1.1",
"qs": "^6.11.0",
"uuid": "^9.0.0",
"vant": "^3.6.6",
"vconsole": "^3.15.0",
"vue": "^3.2.41",
"vue-router": "^4.1.5"
},
"devDependencies": {
"@babel/core": "^7.12.16",
"@babel/eslint-parser": "^7.12.16",
"@babel/polyfill": "^7.12.1",
"@babel/preset-env": "^7.18.6",
"@vue/cli-plugin-babel": "~5.0.0",
"@vue/cli-plugin-eslint": "~5.0.0",
"@vue/cli-plugin-router": "~5.0.0",
"@vue/cli-plugin-vuex": "~5.0.0",
"@vue/cli-service": "~5.0.0",
"cross-env": "^5.2.0",
"cssnano": "^5.1.7",
"eslint": "^7.32.0",
"eslint-plugin-vue": "^8.0.3",
"postcss-aspect-ratio-mini": "^1.1.0",
"postcss-import": "^14.1.0",
"postcss-px-to-viewport": "^1.1.1",
"postcss-url": "^10.1.3",
"stylus": "^0.55.0",
"stylus-loader": "^3.0.2"
"@vitejs/plugin-legacy": "^2.3.1",
"@vitejs/plugin-vue": "^3.2.0",
"less": "^4.1.3",
"terser": "^5.16.0",
"vite": "^3.1.8",
"vite-plugin-pages": "^0.27.1",
"vite-plugin-style-import": "1.4.1"
}
}
<!DOCTYPE html>
<html lang="">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="icon" href="<%= BASE_URL %>favicon.ico" />
<meta name="x5-cache" content="disable" />
<meta name="x5-fullscreen" content="true" />
<meta name="full-screen" content="yes" />
<meta
content="no-cache, no-store, must-revalidate"
http-equiv="Cache-Control"
/>
<meta content="no-cache" http-equiv="Pragma" />
<meta content="0" http-equiv="Expires" />
<meta http-equiv="expires" content="0" />
<meta
name="viewport"
content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no,viewport-fit=cover"
/>
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
<title><%= htmlWebpackPlugin.options.title %></title>
</head>
<body>
<noscript>
<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
</noscript>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
</html>
......@@ -17,7 +17,6 @@
</template>
</Suspense>
</div>
</template>
<script>
......@@ -31,20 +30,18 @@ export default {
};
},
async mounted() {
const TempAccess = process.env.VUE_APP_ENV === 'local' ? '60243b9f-5f2b-41f8-8007-67984b5ae1cd' : ''
const TempAccess = import.meta.env.DEV ? '60243b9f-5f2b-41f8-8007-67984b5ae1cd' : ''
const jumpRouter = await login(TempAccess)
const route = this.$router;
route.replace(jumpRouter.path ? jumpRouter : `${route.options.routes[0].path}`);
},
methods: {
},
route.replace(jumpRouter.path ? jumpRouter : "applications");
}
};
</script>
<style lang="stylus">
<style lang="less">
@import './style/reset.css';
@import './style/var.styl';
@import './style/init.styl';
@import './style/var.less';
@import './style/init.less';
</style>
import { get, post, put } from '@/utils/http'
const baseURL = process.env.VUE_APP_HTTP_BASE_URL
const baseURL = import.meta.env.VITE_HTTP_BASE_URL
const api = {
// getApproalFile(attachmentUUID, bucketName = 'hwfp'){//审批意见中的附件
......
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 261.76 226.69" xmlns:v="https://vecta.io/nano"><path d="M161.096.001l-30.225 52.351L100.647.001H-.005l130.877 226.688L261.749.001z" fill="#41b883"/><path d="M161.096.001l-30.225 52.351L100.647.001H52.346l78.526 136.01L209.398.001z" fill="#34495e"/></svg>
\ No newline at end of file
import { createApp } from 'vue'
import { createPinia } from 'pinia'
import App from './App.vue'
import { router } from './router'
import store from './store'
import { Notify, Toast } from 'vant';
import Vconsole from 'vconsole';
import router from './router'
import moment from 'moment'
import '@babel/polyfill';
import Es6Promise from 'es6-promise'
Es6Promise.polyfill()
import { Notify, Toast } from 'vant';
moment.locale('zh-cn')
let vConsole
if (process.env.VUE_APP_DEBUG === "true") {
const VConsole = require("vconsole");
new VConsole(); // eslint-disable-line
vConsole = new Vconsole();
if (import.meta.env.VITE_DEBUG === "true") {
let vc = await import("vconsole");
vConsole = new vc.default();
}
moment.locale('zh-cn') // 这里是进行了汉化 不写这句默认格式是外国的
const app = createApp(App)
createApp(App)
.use(store)
.use(router)
.use(Notify)
.use(Toast)
.use(vConsole)
.mount('#app')
app.use(createPinia())
app.use(router)
app.use(Notify)
app.use(Toast)
app.use(vConsole)
app.mount('#app')
export default [
]
\ No newline at end of file
import { get, put, post, File, deleteReq } from '@/utils/http'
const baseURL = import.meta.env.VITE_HTTP_BASE_URL
const api = {
// getMakingList (data) { // 查询合同制作列表
// return get(
// `${baseURL}/hlct/v1/0/contracts/toMake`,
// {...data}
// )
// },
};
export default api;
<template>
<div class="contract-item">
<div class="item-title">
<div class="title-desc">
<div class="title-icon">
<slot name="icon" />
</div>
<div class="title-text">
<slot name="title" />
</div>
</div>
<div class="title-arrow">
<i class="arrow-right"></i>
</div>
</div>
<div class="item-warper">
<div class="item-info">
<div class="info-title">
<span>承租人</span>
</div>
<div class="info-value">
<span>{{ itemInfo.tenantName }}</span>
</div>
</div>
<div class="item-info">
<div class="info-title">
<span>业务部门</span>
</div>
<div class="info-value">
<span>{{ itemInfo.unitName }}</span>
</div>
</div>
<div class="item-info">
<div class="info-title">
<span>单据状态</span>
</div>
<div class="info-value">
<span>{{ itemInfo.contractStatusMeaning }}</span>
</div>
</div>
<div class="item-info">
<div class="info-title">
<span>项目经理</span>
</div>
<div class="info-value">
<span>{{ itemInfo.employeeName }}</span>
</div>
</div>
</div>
</div>
</template>
<script setup>
let props = defineProps({
itemInfo: {
type: Object,
default() {
return {}
}
}, //是否必输
});
</script>
<style lang="stylus" scoped>
.contract-item
display flex;
flex-flow column nowrap;
background-color #fff;
color: #646566
border-radius 5%;
padding 0.5rem;
margin-bottom: 20px
.item-title
display flex;
flex-flow row nowrap;
justify-content space-between;
height 10vw;
line-height 9vw;
.title-desc
display flex;
flex-flow row nowrap;
.title-text
font-size 4vw;
margin-left 2vw;
.title-icon
img
width 100%;
height 100%;
width 7vw;
height 7vw;
margin-top 1vw;
.title-arrow
margin-top 1vw;
.item-warper
display flex;
flex-flow row wrap;
justify-content space-around;
padding-left: 32px;
margin-top 1vw;
line-height 5vw;
font-size 3.5vw
.item-info
display flex;
flex-flow row nowrap;
width 50%;
// justify-content space-around;
.info-title
color #888;
min-width 60px;
text-align left
.info-value
margin-left 5px;
min-width 60px;
word-break break-all
.arrow-right
box-sizing border-box;
position relative;
display block;
width 12px;
height 12px;
color #888;
.arrow-rightafter
content "";
display block;
box-sizing border-box;
position absolute;
width 8px;
height 8px;
border-bottom 1px solid;
border-right 1px solid;
transform rotate(-45deg);
right 6px;
top 4px;
</style>
const state = {};
export default {
namespaced: true,
state,
};
<template>
<div class="business container">
<section class="header-board">
<NavBar title="自助服务" left-arrow @click-left="goBack" />
</section>
</div>
</template>
<script setup>
import { goBack } from "@/utils/globalFun"
import { NavBar } from "vant";
import api from "../api";
import { ref } from "vue";
import { useRoute, useRouter } from "vue-router";
let count = $ref(333)
console.log(count);
</script>
<style scoped lang="less">
</style>
<route lang="yaml">
meta:
title: '自助服务'
</route>
import allModules from '../modules'
import { createRouter, createWebHashHistory } from 'vue-router';
const applications = () => import('../views/applications.vue')
let routes = [];
if (process.env.VUE_APP_ENV === "local") {
import { createRouter, createWebHashHistory } from 'vue-router'
import routes from '~pages'
const applicationRoute = {
path: "/",
name: "applications",
component: applications,
meta: { moduleName: 'index' }
};
routes.push(applicationRoute);
let realRoutes = routes;
allModules.map((moduleName) => {
// routes.push(...require(`@/modules/${app}/router`).default);
let Module = require(`@/modules/${moduleName}/router`).default || []
Module.forEach(route => { route.meta.moduleName = moduleName });
routes.push(...Module)
});
} else {
routes.push(
...require(`@/modules/${process.env.VUE_APP_TARGET}/router`).default,
);
if (import.meta.env.PROD) {
let reg = new RegExp(`${import.meta.env.VITE_TARGET}`);
realRoutes = realRoutes.filter((route) => reg.test(route.path))
}
// routes.push({
// path: "*",
// redirect: routes[0].path
// });
console.info('已渲染路由--', realRoutes);
export const router = createRouter({
history: createWebHashHistory(process.env.BASE_URL),
routes: routes
});
const router = createRouter({
history: createWebHashHistory(import.meta.env.VITE_HTTP_BASE_URL),
routes: realRoutes,
})
export default router
\ No newline at end of file
import { createStore } from 'vuex'
import allModules from '../modules'
let modules = {};
if (process.env.VUE_APP_ENV === "local") {
const apps = allModules;
apps.map((app) => {
let ary = app.split("-");
let moduleName = "";
ary.map((item, index) => {
if (index > 0) {
item = item.replace(item.charAt(0), item.charAt(0).toUpperCase());
}
moduleName += item;
});
modules[
moduleName
] = require(`@/modules/${app}/store`).default;
});
} else {
let ary = process.env.VUE_APP_TARGET.split("-");
let moduleName = "";
ary.map((item, index) => {
if (index > 0) {
item = item.replace(item.charAt(0), item.charAt(0).toUpperCase());
}
moduleName += item;
});
modules[
moduleName
] = require(`@/modules/${process.env.VUE_APP_TARGET}/store`).default;
}
const store = {
modules,
state: {
},
getters: {
},
mutations: {
},
actions: {
},
};
export default createStore(store);
import { ref, computed } from 'vue'
import { defineStore } from 'pinia'
export const useCounterStore = defineStore('counter', () => {
const count = ref(0)
const doubleCount = computed(() => count.value * 2)
function increment() {
count.value++
}
return { count, doubleCount, increment }
})
// ios 安全区设置
@supports ((height: constant(safe-area-inset-top)) or (height: env(safe-area-inset-top))) {
body {
/* 适配齐刘海*/
padding-top: constant(safe-area-inset-top);
/* 兼容 iOS < 11.2 */
padding-top: env(safe-area-inset-top);
/* 兼容 iOS >= 11.2 */
/* padding-top: calc(40px(原来的bottom值) + constant(safe-area-inset-top)); */
/* 适配底部黑条*/
padding-bottom: constant(safe-area-inset-bottom);
/* 兼容 iOS < 11.2 */
padding-bottom: env(safe-area-inset-bottom);
/* 兼容 iOS >= 11.2 */
}
}
// 基础配置
body {
height: 100vh;
width: 100vw;
box-sizing: border-box;
background-color: @background-color ;
position: fixed;
#app {
height: 100%;
width: 100%;
overflow: hidden;
background-color: @background-color;
}
}
.container {
height: 100%;
width: 100%;
background-color: @background-color;
color: @text-color;
font-size: 3.74vw;
}
input {
border: none;
}
img {
width: 100%;
height: 100%;
}
// vant 样式调整
.cell-title {
:deep(.van-cell__title span::before) {
display: inline-block;
height: 50%;
width: 3px;
background-color: #3D59C0;
content: "";
margin-right: 5px;
}
:deep(.van-cell__value) {
color: black;
}
}
#app {
.van-nav-bar .van-icon {
color: #333;
}
.van-nav-bar__text {
color: #3d59c0;
}
.van-tabs--line .van-tabs__wrap {
height: 9.733vw;
}
}
\ No newline at end of file
// ios 安全区设置
@supports ((height: constant(safe-area-inset-top)) or (height: env(safe-area-inset-top)))
body
/* 适配齐刘海*/
padding-top constant(safe-area-inset-top); /* 兼容 iOS < 11.2 */
padding-top env(safe-area-inset-top); /* 兼容 iOS >= 11.2 */
/* padding-top: calc(40px(原来的bottom值) + constant(safe-area-inset-top)); */
/* 适配底部黑条*/
padding-bottom constant(safe-area-inset-bottom); /* 兼容 iOS < 11.2 */
padding-bottom env(safe-area-inset-bottom); /* 兼容 iOS >= 11.2 */
// 基础配置
body
height 100vh
width 100vw
box-sizing border-box
background-color $background-color
position fixed
#app
height 100%
width 100%
overflow hidden
background-color $background-color
.container
height 100%
width 100%
background-color $background-color
color: $text-color
font-size: 3.74vw
input
border: none
img
width 100%
height 100%
// 按钮相关配置
button
outline none
border 1px solid transparent
padding 0
.btn
width 40vw;
height 12vw;
padding 5px 10px;
border-radius 5px;
box-shadow 3px 2px 5px rgb(191, 202, 222);
btn-color-create(backcolor, bordcolor, textcolor)
background-color backcolor
border 1px solid bordcolor
color textcolor
.btn_primary
btn-color-create(#3d59c0, #3d59c0, #fff)
.btn_disable
btn-color-create(#f4f4f5, #f4f4f5, #bcbec2)
.btn_plain
btn-color-create(#fff, #3d59c0, #3d59c0)
.btn_danger
btn-color-create(#d9001b, #d9001b, #fff)
.btn_success
btn-color-create(#07c160, #07c160, #fff)
.btn_w_auto
width auto
padding 3.2vw 6.4vw;
// 按钮相关配置 end
// vant 样式调整
.self_tabs
height 100%
box-sizing border-box
.van-tabs__nav
border 1px solid #E4E7F2;
padding 2px;
box-sizing border-box;
border-radius 5px;
margin 0 5px;
.van-tab--active
background-color #E4E7F2;
color #3D59C0;
border-radius 5px;
.van-tabs__line
display none;
.cell-title
:deep(.van-cell__title span::before)
display inline-block;
height 50%;
width 3px;
background-color #3D59C0;
content "";
margin-right 5px;
:deep(.van-cell__value)
color black
#app
.van-nav-bar .van-icon
color: #333
.van-nav-bar__text
color: #3d59c0
.van-tabs--line .van-tabs__wrap
height: 9.733vw;
@import "var.styl"
.hips-view__content {
-webkit-overflow-scrolling touch
}
.hips-view__header {
.hips-tabs {
width 70%
margin-left 15%
.hips-tabs__wrapper {
&:after {
border-bottom-width 0
}
.hips-tab--active {
color $font-color !important
}
}
}
}
// 平移滑动
.router-slide-left {
&-enter {
opacity: .6
transform: translate3d(100%, 0, 0)
}
&-leave-to {
opacity: .6
transform: translate3d(-30%, 0, 0)
}
&-enter-active, &-leave-active {
transition: all .6s cubic-bezier(0.165, 0.84, 0.44, 1)
}
}
.router-slide-right {
&-enter {
opacity: 1
transform: translate3d(-30%, 0, 0)
}
&-leave-to {
opacity: .6
transform: translate3d(100%, 0, 0)
}
&-enter-active, &-leave-active {
transition: all .6s cubic-bezier(0.165, 0.84, 0.44, 1)
}
}
\ No newline at end of file
@background-color: #f7f8fb;
@text-color: #333;
@text-gray-color: #AAA;
\ No newline at end of file
$background-color = #f7f8fb
$text-color = #333
$text-gray-color =#AAA
......@@ -4,7 +4,7 @@ const { download, previewOffice, upload } = Files
const { deviceInfo, copyClipboard } = Device;
const { captureImage, chooseImage } = Camera;
import { get, post, put, File } from '@/utils/http'
let baseUrl = process.env.VUE_APP_HTTP_BASE_URL
let baseUrl = import.meta.env.VITE_HTTP_BASE_URL
// 字典转换成对应格式
......
......@@ -29,17 +29,16 @@ export default {
let routers = this.$router.getRoutes() || []
let modules = {}
routers = routers.filter((route) => route.meta.title && route.meta.moduleName !== "index")
routers.forEach(route => {
let moduleName = route.meta.moduleName
routers = routers
.filter((route) => route.meta.title)
.forEach(route => {
let moduleName = route.path.split('/')[1]
if (!modules.hasOwnProperty(moduleName)) modules[moduleName] = []
modules[moduleName].push(route)
});
this.modules = modules
console.log(this.modules, '==this.modules');
}
......@@ -47,22 +46,29 @@ export default {
};
</script>
<style scoped lang="stylus">
.container
overflow scroll
.module
background-color #eceff9
line-height 5vh
color #4762C3
border 1px solid #e4e7f2
font-size 4vw
font-weight 600
padding-left 2vw
<style scoped lang="less">
.container {
overflow: scroll;
}
.module {
background-color: #eceff9;
line-height: 5vh;
color: #4762C3;
border: 1px solid #e4e7f2;
font-size: 4vw;
font-weight: 600;
padding-left: 2vw;
}
.module_content {
padding: 10px 20px;
}
.module_content
padding 10px 20px
.module_item
color gray
line-height 4vh
.module_item {
color: gray;
line-height: 4vh;
}
</style>
import { fileURLToPath, URL } from 'node:url'
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import legacy from '@vitejs/plugin-legacy'
import Pages from 'vite-plugin-pages'
import styleImport, { VantResolve } from 'vite-plugin-style-import';
import pxtovw from 'postcss-px-to-viewport'
const loader_pxtovw = pxtovw({
unitToConvert: 'px',
viewportWidth: 320,
unitPrecision: 5,
propList: ['*'],
viewportUnit: 'vw',
fontViewportUnit: 'vw',
selectorBlackList: [],
minPixelValue: 1,
mediaQuery: false,
replace: true,
exclude: [],
landscape: false,
landscapeUnit: 'vw',
landscapeWidth: 568
})
// https://vitejs.dev/config/
export default {
plugins: [
vue({ reactivityTransform: true }),
Pages({
dirs: ['src/views', 'src/modules'],
extensions: ['vue'],
exclude: ['**/components/*.vue']
}),
legacy({
targets: ['defaults', 'not IE 11']
}),
styleImport({
resolves: [VantResolve()],
libs: [{
libraryName: 'vant',
esModule: false,
resolveStyle: (name) => `vant/es/${name}/style/index`
}],
}),
],
css: {
postcss: {
plugins: [loader_pxtovw]
}
},
resolve: {
alias: {
'@': fileURLToPath(new URL('./src', import.meta.url))
}
},
server: {
host: '0.0.0.0',
port: 5678
}
}
let path = require('path');
module.exports = {
// publicPath: './',
publicPath: "",
// 不需要生产环境的 source map,将其设置为 false 以加速生产环境构建
productionSourceMap: false,
transpileDependencies: true,
lintOnSave: false,
chainWebpack: config => {
config.module.rule('compile')
.test(/\.js$/)
.include
.end()
.use('babel')
.loader('babel-loader')
.options({
presets: [
['@babel/preset-env', {
modules: false
}]
]
});
},
css: {
loaderOptions: {
stylus: {
import: [path.resolve(__dirname, "src/style/var.styl")],
}
}
}
};
This diff is collapsed.
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