【日常bug记录】Vue3 将 src 的目录设置为 @

关键是这两个文件的设置

  • vite.config.ts
    注意 extensions 的配置,我就是因为没加这个,卡了好久
typescript 复制代码
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import path from 'path';
function resolve(dir) {
  return path.join(__dirname, dir);
}
// https://vitejs.dev/config/
export default defineConfig({
  plugins: [vue()],
  resolve: {
    extensions: ['.js', '.jsx', '.ts', '.tsx', '.json', '.vue'],
    alias: {
      "@": path.resolve("./src") // 相对路径别名配置,使用 @ 代替 src
    }
  }
})
  • tsconfig.json
json 复制代码
{
  "compilerOptions": {
    "baseUrl": "./", // 解析非相对模块的基地址,默认是当前目录
    "paths": { //路径映射,相对于baseUrl
      "@/*": ["src/*"] 
    },
    // 其他配置
}
相关推荐
Манго нектар17 分钟前
JavaScript for循环语句
开发语言·前端·javascript
蒲公英100124 分钟前
vue3学习:axios输入城市名称查询该城市天气
前端·vue.js·学习
Zheng1132 小时前
【可视化大屏】将柱状图引入到html页面中
javascript·ajax·html
john_hjy2 小时前
【无标题】
javascript
软件开发技术深度爱好者2 小时前
用HTML5+CSS+JavaScript庆祝国庆
javascript·css·html5
汪子熙3 小时前
Angular 服务器端应用 ng-state tag 的作用介绍
前端·javascript·angular.js
杨荧3 小时前
【JAVA开源】基于Vue和SpringBoot的旅游管理系统
java·vue.js·spring boot·spring cloud·开源·旅游
一 乐8 小时前
学籍管理平台|在线学籍管理平台系统|基于Springboot+VUE的在线学籍管理平台系统设计与实现(源码+数据库+文档)
java·数据库·vue.js·spring boot·后端·学习
昨天;明天。今天。9 小时前
案例-表白墙简单实现
前端·javascript·css
安冬的码畜日常9 小时前
【玩转 JS 函数式编程_006】2.2 小试牛刀:用函数式编程(FP)实现事件只触发一次
开发语言·前端·javascript·函数式编程·tdd·fp·jasmine