Ruin/vue-frame
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 添加环境配置文件，更新API基础地址

Browse Source
This commit is contained in:
刘引
2025-03-19 13:44:54 +08:00
parent 4368d0a88d
commit 9b35ac6474
17 changed files with 1062 additions and 1341 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
.env.dev Normal file
View File

@@ -0,0 +1,7 @@
# base api
VUE_APP_BASE_API = 'http://127.0.0.1:3000/api'

4
.env.prod Normal file
View File

@@ -0,0 +1,4 @@
# base api
VUE_APP_BASE_API = 'http://10.0.0.88:3000/api'

4
.env.test Normal file
View File

@@ -0,0 +1,4 @@
# base api
VUE_APP_BASE_API = 'http://10.0.0.93:3000/api'

1
auto-imports.d.ts vendored
View File

@@ -3,7 +3,6 @@
// @ts-nocheck // @ts-nocheck
// noinspection JSUnusedGlobalSymbols // noinspection JSUnusedGlobalSymbols
// Generated by unplugin-auto-import // Generated by unplugin-auto-import
// biome-ignore lint: disable
export {} export {}
declare global { declare global {

3
components.d.ts vendored
View File

@@ -1,13 +1,12 @@
/* eslint-disable */ /* eslint-disable */
/* prettier-ignore */
// @ts-nocheck // @ts-nocheck
// Generated by unplugin-vue-components // Generated by unplugin-vue-components
// Read more: https://github.com/vuejs/core/pull/3399 // Read more: https://github.com/vuejs/core/pull/3399
export {} export {}
/* prettier-ignore */
declare module 'vue' { declare module 'vue' {
export interface GlobalComponents { export interface GlobalComponents {
ElButton: typeof import('element-plus/es')['ElButton']
Foot: typeof import('./src/components/Foot.vue')['default'] Foot: typeof import('./src/components/Foot.vue')['default']
Head: typeof import('./src/components/Head.vue')['default'] Head: typeof import('./src/components/Head.vue')['default']
RouterLink: typeof import('vue-router')['RouterLink'] RouterLink: typeof import('vue-router')['RouterLink']

11
index.html
View File

@@ -1,16 +1,13 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="zh-CN"> <html lang="en">
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<link rel="icon" href="/favicon.ico" /> <link rel="icon" href="/favicon.ico" />
<meta <meta name="viewport" content="width=device-width, initial-scale=1.0" />
name="viewport" <title>Vite App</title>
content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0"
/>
<title>东风猛士agv配置</title>
</head> </head>
<body> <body>
<div id="app"></div> <div id="app"></div>
<!-- <script type="module" src="/src/main.ts"></script> --> <script type="module" src="/src/main.ts"></script>
</body> </body>
</html> </html>

36
package.json
View File

@@ -3,29 +3,33 @@
"version": "0.0.0", "version": "0.0.0",
"scripts": { "scripts": {
"dev": "rsbuild dev", "dev": "rsbuild dev",
"build": "rsbuild build", "build:dev": "rsbuild build --env-mode dev",
"build:test": "rsbuild build --env-mode test",
"build:prod": "rsbuild build --env-mode prod",
"preview": "rsbuild preview" "preview": "rsbuild preview"
}, },
"dependencies": { "dependencies": {
"axios": "^1.7.8", "@element-plus/icons-vue": "^2.3.1",
"axios": "^1.8.3",
"dayjs": "^1.11.13", "dayjs": "^1.11.13",
"element-plus": "^2.9.0", "element-plus": "^2.9.6",
"file-saver": "^2.0.5",
"normalize.css": "^8.0.1", "normalize.css": "^8.0.1",
"pinia": "^2.2.8", "pinia": "^3.0.1",
"qs": "^6.11.2", "qs": "^6.14.0",
"vue": "^3.5.13", "vue": "^3.5.13",
"vue-router": "^4.5.0" "vue-router": "^4.5.0",
"xlsx": "^0.18.5"
}, },
"devDependencies": { "devDependencies": {
"@rsbuild/core": "^1.1.7", "@rsbuild/core": "^1.2.19",
"@rsbuild/plugin-sass": "^1.1.1", "@rsbuild/plugin-sass": "^1.2.2",
"@rsbuild/plugin-vue": "^1.0.5", "@rsbuild/plugin-vue": "^1.0.7",
"@types/node": "^18.17.1", "@types/node": "^22.13.10",
"@vitejs/plugin-vue": "^5.2.1", "sass": "^1.86.0",
"sass": "^1.81.1", "typescript": "^5.8.2",
"typescript": "^5.0.0", "unplugin-auto-import": "^19.1.1",
"unplugin-auto-import": "^0.18.6", "unplugin-vue-components": "^28.4.1",
"unplugin-vue-components": "^0.27.5", "vue-tsc": "^2.2.8"
"vue-tsc": "^2.1.10"
} }
} }

2156
pnpm-lock.yaml generated
View File

File diff suppressed because it is too large Load Diff

17
rsbuild.config.ts
View File

@@ -1,19 +1,34 @@
import { defineConfig } from '@rsbuild/core' import { defineConfig } from '@rsbuild/core'
import { pluginVue } from '@rsbuild/plugin-vue' import { pluginVue } from '@rsbuild/plugin-vue'
import { pluginSass } from '@rsbuild/plugin-sass' import { pluginSass } from '@rsbuild/plugin-sass'
const path = require('path')
export default defineConfig({ export default defineConfig({
plugins: [pluginVue(), pluginSass()], plugins: [pluginVue(), pluginSass()],
html: { html: {
template: './index.html' template: './index.html'
}, },
// 设置mode
source: { source: {
entry: { entry: {
index: './src/main.ts' index: './src/main.ts'
}, },
define: {
'process.env.VUE_APP_BASE_API': JSON.stringify(
process.env.VUE_APP_BASE_API
)
},
alias: { alias: {
'@': './src' '@': path.resolve(__dirname, 'src')
} }
}, },
server: {
proxy: {
'/api': 'http://10.0.0.93:3000'
}
},
environments: { environments: {
web: { web: {
source: { source: {

13
src/api/base-service.ts
View File

@@ -12,23 +12,19 @@ import axios from 'axios' //引入 axios库
import qs from 'qs' //引入 node中自带的qs模块（数据格式转换） import qs from 'qs' //引入 node中自带的qs模块（数据格式转换）
/* 2.全局默认配置 */ /* 2.全局默认配置 */
let baseURL let baseURL
let process: any = { let process: any
env: {
NODE_ENV: 'development'
}
}
// 判断开发环境（一般用于本地代理） // 判断开发环境（一般用于本地代理）
if (process.env.NODE_ENV === 'development') { if (process.env.NODE_ENV === 'development') {
// 开发环境 // 开发环境
baseURL = 'https://api.vvhan.com/' // 你设置的本地代理请求（跨域代理），下文会详细介绍怎么进行跨域代理 baseURL = 'http://www.liulongbin.top:3006' // 你设置的本地代理请求（跨域代理），下文会详细介绍怎么进行跨域代理
} else { } else {
// 编译环境 // 编译环境
if (process.env.type === 'test') { if (process.env.type === 'test') {
// 测试环境 // 测试环境
baseURL = 'https://api.vvhan.com/' baseURL = 'http://www.liulongbin.top:3006'
} else { } else {
// 正式环境 // 正式环境
baseURL = 'https://api.vvhan.com/' baseURL = 'http://www.liulongbin.top:3006'
} }
} }
// 配置axios的属性 // 配置axios的属性
@@ -67,7 +63,6 @@ Axios.interceptors.request.use(
return Promise.reject(error) return Promise.reject(error)
} }
) )
Axios.interceptors.response.use( Axios.interceptors.response.use(
(res) => { (res) => {
//请求响应后拦截 //请求响应后拦截

11
src/router/index.ts
View File

@@ -1,4 +1,12 @@
// import path from 'node:path/win32' /*
* @Description: {{ByRuin}}
* @Version: 2.0
* @Author: Ruin 🍭
* @Date: 2022-01-25 16:57:54
* @LastEditors: 刘引
* @LastEditTime: 2022-03-11 14:26:24
*/
import path from 'node:path/win32'
import { createRouter, createWebHashHistory } from 'vue-router' import { createRouter, createWebHashHistory } from 'vue-router'
const routes = [ const routes = [
{ {
@@ -24,3 +32,4 @@ const router = createRouter({
routes routes
}) })
export default router export default router
// 我感觉

63
src/services/home.ts
View File

@@ -1,26 +1,47 @@
import Axios from '@/api/base-service' // 导入配置好的axios文件 /*
// 封装axios请求函数，并用export导出 * @Description: {{ByRuin}}
// get请求 * @Version: 2.0
const getInfo = (params: unknown) => { * @Author: Ruin 🍭
return Axios({ * @Date: 2022-01-25 17:42:57
url: '/api/horoscope', * @LastEditors: 刘引
method: 'get', * @LastEditTime: 2022-01-25 18:04:29
headers: { */
'Content-Type': 'application/x-www-form-urlencoded' //设置请求头请求格式form
},
params
})
}
// post请求 import Axios from "../api/base-service"; // 导入配置好的axios文件
const getItem = (data: unknown) => { // 封装axios请求函数，并用export导出
export function getInfo(datas: unknown) {
return Axios({ return Axios({
url: '/api/getItem', url: "/api.php?key=free&appid=0&msg=鹅鹅鹅",
method: 'post', method: "GET",
headers: { headers: {
'Content-Type': 'application/json' //设置请求头请求格式为json "content-type": "application/json",
}, },
data data: datas,
}) });
}
export function getInfoA(datas: unknown) {
return Axios({
url: "/api/getbooks",
method: "get",
headers: {
"Content-Type": "application/x-www-form-urlencoded", //设置请求头请求格式form
},
data: datas,
});
}
export function getItem(datas: unknown) {
return Axios({
url: "/api/getItem",
method: "post",
headers: {
"Content-Type": "application/json", //设置请求头请求格式为json
},
data: datas,
});
}
export function getItemInfo(datas: unknown) {
return Axios({
url: "/api/getItemInfo" + datas,
method: "get",
});
} }
export { getInfo, getItem }

13
src/utils/other.ts Normal file
View File

@@ -0,0 +1,13 @@
/*
* @Description: {{ByRuin}}
* @Version: 2.0
* @Author: Ruin 🍭
* @Date: 2022-01-25 17:45:05
* @LastEditors: 刘引
* @LastEditTime: 2022-01-25 17:47:27
*/
import axios from "axios";
const otherApi = axios.create({
baseURL: "http://baidu.com",
});
export default otherApi;

13
src/utils/request/request.ts Normal file
View File

@@ -0,0 +1,13 @@
/*
* @Description: {{ByRuin}}
* @Version: 2.0
* @Author: Ruin 🍭
* @Date: 2022-01-25 17:36:26
* @LastEditors: 刘引
* @LastEditTime: 2022-01-25 17:46:39
*/
import axios from 'axios'
const homeApi = axios.create({
baseURL: 'http://baidu.com'
})
export default homeApi

38
src/views/home/index.vue
View File

@@ -1,3 +1,11 @@
<!--
* @Description: {{ByRuin}}
* @Version: 2.0
* @Author: Ruin 🍭
* @Date: 2022-03-10 10:11:06
* @LastEditors: 刘引
* @LastEditTime: 2022-07-26 14:42:06
-->
<template> <template>
<div class="root-home"> <div class="root-home">
<p>我是home组件</p> <p>我是home组件</p>
@@ -6,33 +14,9 @@
</div> </div>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { computed, watch, onUpdated, ref, reactive, onBeforeMount } from 'vue' import { computed, watch, onUpdated, ref, reactive } from 'vue';
import news from './components/news.vue' import news from './components/news.vue'
import { getInfo, getItem } from '@/services/home'
// get请求
const getDataFromApi = async () => {
try {
const res = await getInfo({ type: 'scorpio', time: 'today' })
console.debug(res, '获取到的数据')
} catch (error) {
console.error('get获取星座数据报错', error)
}
}
// post请求
const postDataFromApi = async () => {
try {
} catch (error) {
console.error('post获取数据报错', error)
}
}
// dom加载前调用
onBeforeMount(() => {
// getDataFromApi()
// postDataFromApi()
})
</script> </script>
<style lang="scss" scoped></style> <style lang="scss" scoped>
</style>

3
src/views/index.vue
View File

@@ -1,15 +1,12 @@
<template> <template>
<Head></Head> <Head></Head>
<div>根组件{{ store.count }}</div> <div>根组件{{ store.count }}</div>
<home></home>
<Foot></Foot> <Foot></Foot>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { reactive, onMounted, watch } from 'vue' import { reactive, onMounted, watch } from 'vue'
import { useMain } from '@/store' import { useMain } from '@/store'
import home from '@/views/home/index.vue'
const store = useMain() const store = useMain()
</script> </script>

8
src/views/user/index.vue
View File

@@ -1,3 +1,11 @@
<!--
* @Description: {{ByRuin}}
* @Version: 2.0
* @Author: Ruin 🍭
* @Date: 2022-03-10 10:11:06
* @LastEditors: 刘引 liu.yin.work@foxmail.com
* @LastEditTime: 2023-08-01 15:45:57
-->
<template> <template>
<div class="root-home"> <div class="root-home">
<news></news> <news></news>