vite配置@别名
vite.config.ts
import { defineConfig } from 'vite'import vue from '@vitejs/plugin-vue' // 配置@别名 import { resolve } from "path"; // https://vitejs.dev/config/export default defineConfig({plugins: [vue()],// ↓解析配置resolve: {// ↓路径别名alias: {"@": resolve(__dirname, "./src")}}})
tsconfig.json
{"compilerOptions": {"target": "ESNext",...// 配置@别名"baseUrl": ".","paths": {"@/*": ["src/*"]}, },}
如果运行不了或报错试下安装下 @types/node ,没有报错可以不用安装,有安装也没事
npm install @types/node
vscode智能提示
如果没有提示先下载VScode插件(通用,不至vite,只要配置好@别名就行)
Path-intellisense
安装好后,发现不加一个名字就会以下情况
下面是正确的路径
如果还是没有提示或提示错误(只提示当前路径下的页面),可能是绿色框中要写个名,或给个空对象{}才可以
但这不是我们想要的,我们想要没有写名字的(名字可能没想好的)情况下,加个@/就有src路径下的提示
按照以下步骤来做就好:
复制以下内容到settings.json
{....//添加以下配置(主要是前两个)"path-intellisense.mappings": {"@/": "${workspaceFolder}/src","/": "${workspaceFolder}","lib": "${workspaceFolder}/lib","global": "/Users/dummy/globalLibs"},"path-intellisense.autoTriggerNextSuggestion": true,}
这样就算没有加一个名也可以有自动提示了