Vite-Vue3-TypeScript：002-配置别名

作者：System 时间：2024年08月19日分类：所有,typescript 字数：526

这篇文章距离上次修改已过229天，其中的内容可能已经有所变动。

在Vite + Vue3 + TypeScript项目中配置路径别名，可以使用tsconfig.json文件来实现。

打开项目根目录下的tsconfig.json文件，然后在compilerOptions中添加baseUrl和paths配置：

{
  "compilerOptions": {
    "baseUrl": ".", // 这里设置基础路径为项目根目录
    "paths": {
      "@/*": ["./*"] // 定义一个别名@指向根目录
    }
    // ...其他配置
  },
  // ...其他配置
}

这样配置后，在代码中就可以使用@作为别名来引用根目录下的文件，例如：

// 引用src目录下的utils.ts文件
import Utils from '@/utils.ts';

请注意，Vite 使用其自己的别名解析逻辑，通常不需要在tsconfig.json中配置paths。但是，如果你需要在TypeScript中使用别名，上述配置仍然适用。

Vite-Vue3-TypeScript：002-配置别名

评论已关闭

推荐阅读