vue3中配置文件vue.config.js不生效的解决办法

更新时间：2024年05月16日 10:16:37 作者：qq_26264187

这篇文章主要介绍了vue3中配置文件vue.config.js不生效的解决办法,文中通过代码示例讲解的非常详细,对大家解决问题有一定的帮助,需要的朋友可以参考下

刚学完配置vue.config.js

const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
  transpileDependencies: true,
  devServer: {
    proxy: {
      '/api': {
        target: 'http://192.168.1.228:8080', //后端的地址
        ws: true,
        changeOrigin: true,
        pathRewrite: {
          '^/api': ''
        }
      },
 
    }
  }
})

发现访问http://localhost:5173/api/login/user访问结果404

经检查package.json文件

 "scripts": {
    "dev": "vite",
    "build": "vite build",
    "preview": "vite preview"
  }

发现Vue 3 在使用 Vite 作为构建工具，所以跨域配置应在 vite.config.js 文件中进行

import { fileURLToPath, URL } from 'node:url'
 
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
 
// https://vitejs.dev/config/
export default defineConfig({
  plugins: [
    vue(),
  ],
  resolve: {
    alias: {
      '@': fileURLToPath(new URL('./src', import.meta.url))
    }
  },server:{
  proxy:{
    '/api':{
      target:'http://192.168.1.228:8080',
      changeOrigin:true,
      rewrite:path=>path.replace(/^\/api/,'')
    }
  }
  }
 
})

配置完成重启，访问成功

以上就是vue3中配置文件vue.config.js不生效的解决办法的详细内容，更多关于vue3 vue.config.js不生效的资料请关注脚本之家其它相关文章！

您可能感兴趣的文章:

el-table树形表格表单验证(列表生成序号)
这篇文章主要介绍了el-table树形表格表单验证(列表生成序号)，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
2020-05-05
基于Vue实现封装一个虚拟列表组件
正常情况下，我们对于数据都会分页加载，最近项目中确实遇到了不能分页的场景，如果不分页，页面渲染几千条数据就会感知到卡顿，使用虚拟列表就势在必行了。本文主要介绍了如何基于Vue实现封装一个虚拟列表组件，感兴趣的可以了解一下
2023-03-03
Vue3.0 手写放大镜效果
放大镜在很多购物网站都可以看的到，本文主要实现固定放大两倍,鼠标进入到左侧图片区域的时候,遮罩层显示,离开时,遮罩层隐藏，感兴趣的可以了解一下
2021-07-07
vue3与elementui封装一个便捷Loading
这篇文章主要介绍了vue3与elementui封装一个便捷Loading，，文章围绕主题展开详细的内容介绍，具有一定的参考价值，需要的小伙伴可以参考一下
2022-09-09
解决vue $http的get和post请求跨域问题
这篇文章主要介绍了解决vue $http的get和post请求跨域问题，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教
2021-06-06
在vue中安装使用vux的教程详解
这篇文章主要介绍了在vue中安装使用vux的教程，本文给大家记录了vuex的安装使用过程，非常不错，具有一定的参考借鉴价值 ,需要的朋友可以参考下
2018-09-09
如何使用Vue3构建一个图像画廊(支持图片上传)
这篇文章主要给大家介绍了关于如何使用Vue3构建一个图像画廊(支持图片上传)的相关资料,Vue画廊这是vue编写的图库应用程序,文中通过代码介绍的非常详细,需要的朋友可以参考下
2024-09-09
vue中的适配px2rem示例代码
这篇文章主要给大家介绍了关于vue中适配px2rem的相关资料，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
2018-11-11
基于Vue实现支持按周切换的日历
这篇文章主要为大家详细介绍了基于Vue实现支持按周切换的日历，根据实际开发情况按每年、每月、每周进行切换，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2017-08-08
详细聊聊Vue的混入和继承
混入(mixin)是一种非常灵活的方式,用来分发Vue组件中可复用的功能,一个混入对象可以包含任意组件选项,下面这篇文章主要给大家介绍了关于Vue混入和继承的相关资料,需要的朋友可以参考下
2021-09-09

vue3中配置文件vue.config.js不生效的解决办法

相关文章

最新评论

大家感兴趣的内容

最近更新的内容

常用在线小工具