vite.config怎么配置
时间: 2023-10-14 10:17:33 浏览: 46
vite.config.js 是 Vite 的配置文件,用于配置项目的各种选项。以下是一些常见的配置项:
- `root`:指定项目的根目录,默认为当前工作目录。
- `base`:指定项目在服务器上的基础路径,默认为 `/`。
- `build`:指定项目的构建选项,如输出目录、打包格式等。
- `plugins`:指定使用的插件,如 Vue 插件、CSS 预处理器插件等。
示例配置:
```js
// vite.config.js
export default {
root: './src',
base: '/my-app/',
build: {
outDir: '../dist',
rollupOptions: {
input: './index.html',
output: {
format: 'es',
},
},
},
plugins: [
vue(),
postcss(),
],
};
```
相关问题
vite.config 配置
vite.config.js 是 Vite 构建工具的配置文件,用于配置项目的构建选项和插件等。下面是一个简单的示例:
```javascript
import { defineConfig } from 'vite';
export default defineConfig({
// 项目根目录
root: './src',
// 目标浏览器
target: 'es2015',
// 输出目录
build: {
outDir: '../dist',
emptyOutDir: true,
minify: 'terser',
},
// 插件配置
plugins: [
// 插件列表
],
});
```
你可以根据自己的需要在这个配置文件中添加或修改相应的选项。例如,你可以设置根目录、目标浏览器、输出目录以及加载自定义插件等。具体的配置选项可以参考 Vite 官方文档。
vite.config.js 配置
vite.config.js 是 Vite 构建工具的配置文件,用于配置项目的各种构建选项。以下是一些常见的配置选项:
1. base:指定应用程序部署的基本路径,默认为 '/'。
2. root:指定应用程序的根目录,默认为当前工作目录。
3. plugins:用于配置 Vite 插件。
4. resolve:用于配置模块解析选项。
5. css:用于配置 CSS 预处理器选项。
6. build:用于配置生产环境构建选项,例如输出目录、是否开启压缩等。
下面是一个示例 vite.config.js 文件:
```javascript
import { defineConfig } from 'vite';
import vue from '@vitejs/plugin-vue';
export default defineConfig({
base: '/my-app/',
root: __dirname,
plugins: [vue()],
resolve: {
alias: {
'@': '/src',
},
},
css: {
preprocessorOptions: {
scss: {
additionalData: `@import "@/styles/variables.scss";`,
},
},
},
build: {
outDir: 'dist',
minify: true,
sourcemap: false,
},
});
```