You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
52 lines
1.1 KiB
Markdown
52 lines
1.1 KiB
Markdown
---
|
|
{
|
|
.title = "Adding aliases in vite with typescript needs the same alias in tsconfig",
|
|
.date = @date("2022-02-22T00:00:00"),
|
|
.author = "koehr",
|
|
.draft = false,
|
|
.layout = "til.html",
|
|
.description = "",
|
|
.tags = [],
|
|
.custom = { .source = "" },
|
|
}
|
|
---
|
|
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/*`).
|