import axios from 'axios'
import type { AxiosInstance, AxiosRequestConfig, AxiosResponse } from 'axios'
interface HMRequestInterceptors {
requestInterceptor?: (config: AxiosRequestConfig) => AxiosRequestConfig
requestInterceptorCatch?: (err: any) => any
responseInterceptor?: (config: AxiosResponse) => AxiosResponse
responseInterceptorCatch?: (err: any) => any
}
interface HYRequestConfig extends AxiosRequestConfig {
interceptors?: HMRequestInterceptors
}
class HMRequest {
instance: AxiosInstance
interceptors?: HMRequestInterceptors
constructor(config: HYRequestConfig) {
this.instance = axios.create(config)
this.interceptors = config.interceptors
this.instance.interceptors.request.use(
this.interceptors?.requestInterceptor,
this.interceptors?.requestInterceptorCatch
)
this.instance.interceptors.response.use(
this.interceptors?.responseInterceptor,
this.interceptors?.responseInterceptorCatch
)
}
request(config: HYRequestConfig): void {
this.instance.request(config).then((res) => {
console.log(res)
axios.create(config).interceptors.request.use()
})
}
}
export default HMRequest
```typescript
> vue3-ts-cms@0.1.0 serve
> vue-cli-service serve
INFO Starting development server...
98% after emitting CopyPlugin
ERROR Failed to compile with 1 error 上午12:06:18
error in ./src/service/request/index.ts
Module parse failed: Unexpected token (7:61)
File was processed with these loaders:
* ./node_modules/cache-loader/dist/cjs.js
* ./node_modules/babel-loader/lib/index.js
* ./node_modules/ts-loader/index.js
* ./node_modules/eslint-loader/index.js
You may need an additional loader to handle the result of these loaders.
| this.instance = axios.create(config);
| this.interceptors = config.interceptors;
> this.instance.interceptors.request.use(this.interceptors?.requestInterceptor, this.interceptors?.requestInterceptorCatch);
| this.instance.interceptors.response.use(this.interceptors?.responseInterceptor, this.interceptors?.responseInterceptorCatch);
| }