vscode路径提示插件Path Intellisense
安装配置
在应用商店搜索Path Intellisense然后安装,安装之后需要配置

image.png

image.png
点击设置按钮,在下拉列表中点击--扩展设置 选项,然后打开setting.json文件

image.png
在文件中添加配置
作者:Sun____
链接:https://www.jianshu.com/p/de4cc836b147
来源:简书
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。
在 vite.config.ts 文件中
npm install @types/node --save-dev
import { resolve } from 'path'
import { defineConfig } from 'vite' import vue from '@vitejs/plugin-vue' import { resolve } from 'path' // https://vitejs.dev/config/ export default defineConfig({ plugins: [vue()], server: { host: '0.0.0.0',//���vite use `--host` to expose port: 1337, open: true }, resolve: { alias: [ { find: '@', replacement: resolve(__dirname, 'src') } ] } })
在 tsconfig.json
"baseUrl": ".", // 用于设置解析非相对模块名称的基本目录,相对模块不会受到baseUrl的影响
"paths": { // 用于设置模块名到基于baseUrl的路径映射
"@/*":["src/*"]
}
{ "compilerOptions": { "target": "esnext", "useDefineForClassFields": true, "module": "esnext", "moduleResolution": "node", "strict": true, "jsx": "preserve", "sourceMap": true, "resolveJsonModule": true, "isolatedModules": true, "esModuleInterop": true, "lib": ["esnext", "dom"], "skipLibCheck": true, "baseUrl": ".", // 用于设置解析非相对模块名称的基本目录,相对模块不会受到baseUrl的影响 "paths": { // 用于设置模块名到基于baseUrl的路径映射 "@/*":["src/*"] }, }, "include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue"], "references": [{ "path": "./tsconfig.node.json" }], "exclude": ["node_modules"]//ts 排除的文件 }