docs: add line highlighting for resolve paths instructions (#331)
This commit is contained in:
parent
08d6ea6a53
commit
41660d36cd
|
|
@ -24,7 +24,7 @@ Install `tailwindcss` and its peer dependencies, then generate your `tailwind.co
|
||||||
|
|
||||||
|
|
||||||
<TabsMarkdown>
|
<TabsMarkdown>
|
||||||
<TabMarkdown title="vite.config.ts">
|
<TabMarkdown title="vite.config">
|
||||||
|
|
||||||
Vite already has [`postcss`](https://github.com/vitejs/vite/blob/main/packages/vite/package.json#L78) dependency so you don't have to install it again in your package.json
|
Vite already has [`postcss`](https://github.com/vitejs/vite/blob/main/packages/vite/package.json#L78) dependency so you don't have to install it again in your package.json
|
||||||
|
|
||||||
|
|
@ -34,7 +34,7 @@ Install `tailwindcss` and its peer dependencies, then generate your `tailwind.co
|
||||||
|
|
||||||
#### `vite.config`
|
#### `vite.config`
|
||||||
|
|
||||||
```typescript {5,6,10-14}
|
```typescript {5,6,9-13}
|
||||||
import path from "path"
|
import path from "path"
|
||||||
import { defineConfig } from "vite"
|
import { defineConfig } from "vite"
|
||||||
import vue from "@vitejs/plugin-vue"
|
import vue from "@vitejs/plugin-vue"
|
||||||
|
|
@ -43,13 +43,17 @@ Install `tailwindcss` and its peer dependencies, then generate your `tailwind.co
|
||||||
import autoprefixer from "autoprefixer"
|
import autoprefixer from "autoprefixer"
|
||||||
|
|
||||||
export default defineConfig({
|
export default defineConfig({
|
||||||
plugins: [vue()],
|
|
||||||
css: {
|
css: {
|
||||||
postcss: {
|
postcss: {
|
||||||
plugins: [tailwind(), autoprefixer()],
|
plugins: [tailwind(), autoprefixer()],
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
resolve: {...}
|
plugins: [vue()],
|
||||||
|
resolve: {
|
||||||
|
alias: {
|
||||||
|
"@": path.resolve(__dirname, "./src"),
|
||||||
|
},
|
||||||
|
},
|
||||||
})
|
})
|
||||||
```
|
```
|
||||||
|
|
||||||
|
|
@ -81,10 +85,16 @@ Install `tailwindcss` and its peer dependencies, then generate your `tailwind.co
|
||||||
|
|
||||||
Add the code below to the compilerOptions of your tsconfig.json so your app can resolve paths without error
|
Add the code below to the compilerOptions of your tsconfig.json so your app can resolve paths without error
|
||||||
|
|
||||||
```typescript
|
```json {4-7}
|
||||||
"baseUrl": ".",
|
{
|
||||||
"paths": {
|
"compilerOptions": {
|
||||||
|
// ...
|
||||||
|
"baseUrl": ".",
|
||||||
|
"paths": {
|
||||||
"@/*": ["./src/*"]
|
"@/*": ["./src/*"]
|
||||||
|
}
|
||||||
|
// ...
|
||||||
|
}
|
||||||
}
|
}
|
||||||
```
|
```
|
||||||
|
|
||||||
|
|
@ -97,12 +107,17 @@ Add the code below to the vite.config.ts so your app can resolve paths without e
|
||||||
npm i -D @types/node
|
npm i -D @types/node
|
||||||
```
|
```
|
||||||
|
|
||||||
```typescript
|
```typescript {12-16}
|
||||||
import path from "path"
|
import path from "path"
|
||||||
import vue from "@vitejs/plugin-vue"
|
import vue from "@vitejs/plugin-vue"
|
||||||
import { defineConfig } from "vite"
|
import { defineConfig } from "vite"
|
||||||
|
|
||||||
export default defineConfig({
|
export default defineConfig({
|
||||||
|
css: {
|
||||||
|
postcss: {
|
||||||
|
plugins: [tailwind(), autoprefixer()],
|
||||||
|
},
|
||||||
|
},
|
||||||
plugins: [vue()],
|
plugins: [vue()],
|
||||||
resolve: {
|
resolve: {
|
||||||
alias: {
|
alias: {
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue
Block a user