42 lines
986 B
Markdown
42 lines
986 B
Markdown
|
# Adding aliases in vite with typescript needs the same alias in tsconfig
|
||
|
|
||
|
For example:
|
||
|
|
||
|
The following vite.config.ts:
|
||
|
|
||
|
```ts
|
||
|
import { fileURLToPath, URL } from "url"
|
||
|
import { defineConfig } from 'vite'
|
||
|
import vue from '@vitejs/plugin-vue'
|
||
|
|
||
|
// https://vitejs.dev/config/
|
||
|
export default defineConfig({
|
||
|
plugins: [vue()],
|
||
|
resolve: {
|
||
|
alias: {
|
||
|
"~": fileURLToPath(new URL("./src", import.meta.url)),
|
||
|
"~component": fileURLToPath(new URL("./src/components", import.meta.url)),
|
||
|
"~composable": fileURLToPath(new URL("./src/composables", import.meta.url)),
|
||
|
"~lib": fileURLToPath(new URL("./src/lib", import.meta.url)),
|
||
|
}
|
||
|
}
|
||
|
})
|
||
|
```
|
||
|
|
||
|
will need this in tsconfig.json:
|
||
|
|
||
|
```json
|
||
|
{
|
||
|
"compilerOptions": {
|
||
|
"paths": {
|
||
|
"~/*": [ "./src/*" ],
|
||
|
"~component/*": [ "./src/components/*" ],
|
||
|
"~composable/*": [ "./src/composables/*" ],
|
||
|
"~lib/*": [ "./src/lib/*" ]
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
```
|
||
|
|
||
|
The asterixes in the syntax are important (`alias/*` => `./path/*`).
|