vue 踩坑记录

本地开发没有cookie 解决方案

设置代理,并把changeOrigin设为true

proxy的changeOrigin如果设置为false:请求头中host仍然是浏览器发送过来的host;

如果设置成true:发送请求头中host会设置成target。

允许axios请求携带cookie等凭证

避坑:vite Component provided template option but runtime compilation is not supported in this...

javascript 复制代码
This worked for me in vite.config.js
export default defineConfig({ 
        define: { "process.env": {} }, 
        plugins: [vue()], 
        resolve: { alias: { "vue": "vue/dist/vue.esm-bundler.js" } } })  // 这里是重点

antd 主题色更换踩坑 参考https://www.icode9.com/content-4-524054.html

vue3 vite 不能使用require 的替代方案

方案一:

js 复制代码
 const getUrl=(url)=>{
        return new URL(url,import.meta.url).href;
        }
// 使用
const imgsrc = getUrl('../assets/images/logo.png');

或页面中直接使用

html 复制代码
 <img :src="getUrl('../assets/images/logo.png')" style="width: 200px">

方案二:

js 复制代码
// 方案解析:通过import.meta.globEager拿到文件夹下所有文件,传入path获取映射的文件,
        //  default为此文件路径
    const getUrl=(path)=>{
           const modules = import.meta.globEager('../../../assets/ft-images/*');
        return modules[path].default;
}
相关推荐
工业甲酰苯胺3 小时前
TypeScript枚举类型应用:前后端状态码映射的最简方案
javascript·typescript·状态模式
brzhang3 小时前
我操,终于有人把 AI 大佬们 PUA 程序员的套路给讲明白了!
前端·后端·架构
止观止3 小时前
React虚拟DOM的进化之路
前端·react.js·前端框架·reactjs·react
goms3 小时前
前端项目集成lint-staged
前端·vue·lint-staged
谢尔登4 小时前
【React Natve】NetworkError 和 TouchableOpacity 组件
前端·react.js·前端框架
Lin Hsüeh-ch'in4 小时前
如何彻底禁用 Chrome 自动更新
前端·chrome
augenstern4166 小时前
HTML面试题
前端·html
张可6 小时前
一个KMP/CMP项目的组织结构和集成方式
android·前端·kotlin
G等你下课6 小时前
React 路由懒加载入门:提升首屏性能的第一步
前端·react.js·前端框架
谢尔登7 小时前
【React Native】ScrollView 和 FlatList 组件
javascript·react native·react.js