封装方法，搭建项目

.browserslistrc

@@ -1,4 +0,0 @@
-> 1%
-last 2 versions
-not dead
-not ie 11

.editorconfig

@@ -1,5 +0,0 @@
-[*.{js,jsx,ts,tsx,vue}]
-indent_style = space
-indent_size = 2
-trim_trailing_whitespace = true
-insert_final_newline = true

.env.development

@@ -0,0 +1,5 @@
+# .env.development
+
+VUE_APP_API_URL="123123123"
+
+# VUE_APP_FEATURE_FLAG=true

.env.production

@@ -0,0 +1,5 @@
+# .env.production
+
+VUE_APP_API_URL="434534534"
+
+# VUE_APP_FEATURE_FLAG=true

.eslintrc.js

@@ -1,17 +0,0 @@
-module.exports = {
-  root: true,
-  env: {
-    node: true
-  },
-  extends: [
-    'plugin:vue/vue3-essential',
-    '@vue/standard'
-  ],
-  parserOptions: {
-    parser: '@babel/eslint-parser'
-  },
-  rules: {
-    'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
-    'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off'
-  }
-}

README.md

@@ -1,4 +1,4 @@
-# tk-demo
+# tk-page
 
 ## Project setup
 ```
@@ -15,10 +15,5 @@ npm run serve
 npm run build
 ```
 
-### Lints and fixes files
-```
-npm run lint
-```
-
 ### Customize configuration
 See [Configuration Reference](https://cli.vuejs.org/config/).

package.json

@@ -1,31 +1,28 @@
 {
-  "name": "tk-demo",
+  "name": "tk-page",
   "version": "0.1.0",
   "private": true,
   "scripts": {
     "serve": "vue-cli-service serve",
-    "build": "vue-cli-service build",
+    "build": "vue-cli-service build"
-    "lint": "vue-cli-service lint"
   },
   "dependencies": {
+    "axios": "^1.8.4",
     "core-js": "^3.8.3",
     "vue": "^3.2.13",
     "vue-router": "^4.0.3",
     "vuex": "^4.0.0"
   },
   "devDependencies": {
-    "@babel/core": "^7.12.16",
-    "@babel/eslint-parser": "^7.12.16",
     "@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",
+    "@vue/cli-service": "~5.0.0"
-    "@vue/eslint-config-standard": "^6.1.0",
+  },
-    "eslint": "^7.32.0",
+  "browserslist": [
-    "eslint-plugin-import": "^2.25.3",
+    "> 1%",
-    "eslint-plugin-node": "^11.1.0",
+    "last 2 versions",
-    "eslint-plugin-promise": "^5.1.0",
+    "not dead",
-    "eslint-plugin-vue": "^8.0.3"
+    "not ie 11"
-  }
+  ]
 }

src/App.vue

@@ -1,9 +1,11 @@
 <template>
-  <nav>
+  <div>
-    <router-link to="/">Home</router-link> |
+    <nav>
-    <router-link to="/about">About</router-link>
+      <router-link to="/">Home</router-link> |
-  </nav>
+      <router-link to="/about">About</router-link>
-  <router-view/>
+    </nav>
+    <router-view />
+  </div>
 </template>
 
 <style>

src/api/test.js

@@ -0,0 +1,14 @@
+import { getAxios, postAxios } from '@/utils/axios.js'
+
+export function apiGetListXX(data) {
+    return postAxios({ url: '/cgi-bin/draft/batchget', data })
+}
+export function apiAddXX(data) {
+    return postAxios({ url: '/cgi-bin/draft/add', data })
+}
+export function apiGetCart() {
+    return getAxios({ url: '/cgi-bin/cart/latest' })
+}
+export function test() { 
+    return getAxios({ url: 'https://share.gdaiyy.com/zhihui_config.json' })
+}

src/components/HelloWorld.vue

@@ -11,7 +11,6 @@
       <li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-babel" target="_blank" rel="noopener">babel</a></li>
       <li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-router" target="_blank" rel="noopener">router</a></li>
       <li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-vuex" target="_blank" rel="noopener">vuex</a></li>
-      <li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-eslint" target="_blank" rel="noopener">eslint</a></li>
     </ul>
     <h3>Essential Links</h3>
     <ul>

src/stores/notice.js

@@ -0,0 +1,12 @@
+import { defineStore } from 'pinia';
+
+export const noticeStore = defineStore('noticeNum', {
+	state: () => {
+		return { data: { num: 0 } };
+	},
+	actions: {
+		increment() {
+			this.data.num++;
+		},
+	},
+});

src/utils/axios.js

@@ -0,0 +1,85 @@
+/**
+ * axios请求封装
+ * https://rudon.blog.csdn.net/
+ */
+import axios from 'axios'
+import { getToken, setToken, removeToken } from '@/utils/storage'
+// 请求地址前缀
+let baseURL = ''
+if (process.env.NODE_ENV === 'production') {
+    // 生产环境
+    baseURL = ""
+} else {
+    // 开发环境
+    baseURL = ""
+}
+
+// 请求拦截器
+axios.interceptors.request.use((config) => {
+    if (getToken()) {
+        config.headers['token'] = getToken();
+    }
+    // 请求超时时间 - 毫秒
+    config.timeout = 10000
+    config.baseURL = baseURL
+    // 自定义Content-type
+    // config.headers['Content-type'] = 'application/json'
+    return config;
+}, (error) => {
+    return Promise.reject(error)
+})
+
+// 响应拦截器
+axios.interceptors.response.use((response) => {
+    /**
+     * 可添加请求响应的处理逻辑, 例如接口自定义的response.data.code不是200代表失败。
+     * 错误的话 return Promise.reject(response)
+     * 正确的话 return response
+     */
+    return response
+}, (error) => {
+    // 可添加请求失败后的处理逻辑
+    return Promise.reject(error)
+})
+
+
+
+// axios的get请求
+// 导出一个函数，用于发送GET请求
+// 返回一个Promise对象
+export function getAxios({ url, params }) {
+    // 使用axios发送GET请求
+    return new Promise((resolve, reject) => {
+        axios.get(url, {
+            params
+            // 请求成功，将返回的数据传递给resolve函数
+        }).then(res => {
+            resolve(res.data)
+            // 请求失败，将错误信息传递给reject函数
+        }).catch(err => {
+            console.log(err)
+            reject(err)
+        })
+    })
+}
+
+// axios的post请求
+export function postAxios({ url, data }) {
+    return new Promise((resolve, reject) => {
+        axios.post(
+            url,
+            data,
+            {
+                headers: {
+                    'Content-Type': 'application/x-www-form-urlencoded'
+                }
+            }
+        ).then(res => {
+            resolve(res.data)
+        }).catch(err => {
+            reject(err)
+        })
+    })
+}
+
+export default axios

src/utils/storage.js

@@ -0,0 +1,11 @@
+export default {
+	getToken() {
+		return localStorage.getItem('token');
+	},
+	setToken(token) {
+		localStorage.setItem('token', token);
+	},
+	removeToken() {
+		localStorage.removeItem('token');
+	}
+}

src/views/HomeView.vue

@@ -1,18 +1,14 @@
 <template>
   <div class="home">
     <img alt="Vue logo" src="../assets/logo.png">
-    <HelloWorld msg="Welcome to Your Vue.js App"/>
+    <HelloWorld msg="Welcome to Your Vue.js App" />
   </div>
 </template>
 
-<script>
+<script setup>
 // @ is an alias to /src
 import HelloWorld from '@/components/HelloWorld.vue'
 
-export default {
+console.log(process.env.VUE_APP_API_URL)
-  name: 'HomeView',
+
-  components: {
-    HelloWorld
-  }
-}
 </script>