[vite] 关于 alias 使用问题

1,371 阅读1分钟

背景

vite 2.0时,对 alias 的支持不足,当时是选择使用第三方的插件 vite-aliases 来使用 alias 的,但仍有一些问题,e.g. 1、没有路径补全;
2、无法通过 command + click 跳转到模块;

之前使用过一些 vscode 插件,但总体不太如意。最近看到 volar 对这些特性已有支持,所以抽时间来试用了下,先说结论:

对 vue 项目流畅使用,但对 vue-ts 项目仍有一些问题。

使用

以 src 目录为例:

1、修改 vite.config.js 配置:

export default defineConfig({
  resolve: {
    alias: {
      "@": resolve(__dirname, './src')
    }
  }
})

2、增加 volar 对项目的个性化配置(根目录下创建 jsconfig.json);

{
  "compilerOptions": {
    "baseUrl": ".",
    "paths": {
      "@/*": [
        "src/*"
      ]
    }
  },
  "exclude": [
    "node_modules",
    "public"
  ]
}

问题记录

1、使用 vue-ts 模板仍有问题,没有代码补全和跳转,关联 issue,后面等完善后再更新下;