vue3 自动导入自己的js文件中的函数

• vite.config.js

import AutoImport from 'unplugin-auto-import/vite'export default defineConfig({resolve: {alias: {'@': fileURLToPath(new URL('./src', import.meta.url))}},plugins: [vue(),AutoImport({imports: ['vue', 'vue-router', 'pinia',{from: '@/utils/request.js',imports: ['http'],}],}),]})

• request.js文件

import axios from 'axios'
import qs from 'qs'import NProgress from 'nprogress' // 引入nprogress插件
import 'nprogress/nprogress.css' // 这个nprogress样式必须引入axios.defaults.headers = { 'Content-Type': 'application/x-www-form-urlencoded' }
axios.defaults.baseURL = import.meta.env.VITE_APP_BASE_URL
const instance = axios.create({timeout: 60000
})// 请求拦截器
instance.interceptors.request.use((config) => {//form表单提交multipart/form-data的时候，不需要序列化参数if (config.method === 'post' && config.headers['Content-Type'] === 'application/x-www-form-urlencoded') {// skipNulls: true 设置null值不转换成空字符串config.data = qs.stringify(config.data, { indices: false, skipNulls: true })}NProgress.start()return config},(err) => Promise.reject(err)
)
instance.interceptors.response.use(function (response) {NProgress.done()return response},function (error) {NProgress.done()return Promise.reject(error)}
)export const http = instanceexport default instance

• 这样在别的文件中就可以直接引用http，不需要import

<script setup>let allData = ref([])
const getData = async () => {http.post('/api/data').then((res) => {allData.value = res.data})
}getData()
</script><template><div>test</div><div class="chart"><MyChart2 :data="allData"></MyChart2></div>
</template><style scoped lang="scss">
.chart {width: 100%;height: 400px;
}
</style>