Update vite.md for latest Vite configuration in Vue projects

Now, Vue JS with Vite has these changes in "vite.config.js" file.
This commit is contained in:
Otabek 2024-10-17 19:39:10 +05:00 committed by GitHub
parent f9615d3657
commit 9aee948173
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -44,28 +44,32 @@ Install `tailwindcss` and its peer dependencies, then generate your `tailwind.co
#### `vite.config`
```typescript {5,6,9-13}
import path from 'node:path'
import vue from '@vitejs/plugin-vue'
import autoprefixer from 'autoprefixer'
```typescript {3,4,11-15}
import { fileURLToPath, URL } from 'node:url'
import tailwind from 'tailwindcss'
import { defineConfig } from 'vite'
import autoprefixer from 'autoprefixer'
import tailwind from 'tailwindcss'
export default defineConfig({
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
// https://vite.dev/config/
export default defineConfig({
css: {
postcss: {
plugins: [tailwind(), autoprefixer()],
},
},
plugins: [vue()],
plugins: [
vue(),
],
resolve: {
alias: {
'@': path.resolve(__dirname, './src'),
},
},
})
```
'@': fileURLToPath(new URL('./src', import.meta.url))
}
}
})
```
</TabMarkdown>
@ -121,26 +125,30 @@ Add the code below to the vite.config.ts so your app can resolve paths without e
npm i -D @types/node
```
```typescript {15-19}
import path from 'node:path'
import vue from '@vitejs/plugin-vue'
```typescript {20-22}
import { fileURLToPath, URL } from 'node:url'
import autoprefixer from 'autoprefixer'
import tailwind from 'tailwindcss'
import { defineConfig } from 'vite'
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
// https://vite.dev/config/
export default defineConfig({
css: {
postcss: {
plugins: [tailwind(), autoprefixer()],
},
},
plugins: [vue()],
plugins: [
vue(),
],
resolve: {
alias: {
'@': path.resolve(__dirname, './src'),
},
},
'@': fileURLToPath(new URL('./src', import.meta.url))
}
}
})
```