ps:没配置过,先初步体验一下配置效果,不会细究其配置,说人话就是先跟着官网文档的描述走一遍配置
注意1:除了以下选项之外您还可以使用 Vite 中的任何配置选项。例如,
define
定义全局变量,或resolve.alias
定义别名。注意2:此处列出的所有选项都位于配置内的
test
属性上:注意3:针对于所有不支持配置工作区项目的选项旁边都有 * 符号。
include
-
type
-
string[]
-
-
default
-
['/.{test,spec}.?(c|m)[jt]s?(x)'
-
-
功能
-
使用glob模式包含在测试运行中的文件
-
-
代码配置
/// <reference types="vitest" />
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
// https://vitejs.dev/config/
export default defineConfig({
plugins: [vue()],
test: {
include: ['./src/scripts/**.test.?(c|m)[jt]s?(x)']
}
})
目录结构
测试结果
不做配置的测试结果
exclude
-
type
-
string[]
-
-
default
-
['/nodemodules/','/dist/,'/cypress/','/{idea,git,cache,output,temp}/','*/{karma,rollup,webpack,vite,vitest,jest,ava,babel,nyc,cypress,tsup,build}.config.']
-
-
功能
-
使用glob模式从测试运行中排除的文件
-
-
目录配置
-
在src下增加tests目录,在tests目录下新增a.test.js
-
-
代码配置1
/// <reference types="vitest" />
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
// https://vitejs.dev/config/
export default defineConfig({
plugins: [vue()],
test: {
include: ['./src/scripts/**.test.?(c|m)[jt]s?(x)'],
exclude: ['**/node_modules/**', '**/dist/**', '**/cypress/**', '**/.{idea,git,cache,output,temp}/**', '**/{karma,rollup,webpack,vite,vitest,jest,ava,babel,nyc,cypress,tsup,build}.config.*', './src/scripts/each.test.js(x)', './src/scripts/**.test.?(c|m)[jt]s?(x)']
}
})
-
测试结果1
-
和上次结果一样
-
结论
include的优先级大于exclude,如果出现配置相同的情况,则以include的情况为主
- 代码配置2
/// <reference types="vitest" />
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
// https://vitejs.dev/config/
export default defineConfig({
plugins: [vue()],
test: {
exclude: ['**/node_modules/**', '**/dist/**', '**/cypress/**', '**/.{idea,git,cache,output,temp}/**', '**/{karma,rollup,webpack,vite,vitest,jest,ava,babel,nyc,cypress,tsup,build}.config.*']
}
})
-
测试结果2
-
代码配置3
/// <reference types="vitest" />
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
// https://vitejs.dev/config/
export default defineConfig({
plugins: [vue()],
test: {
exclude: ['**/node_modules/**', '**/dist/**', '**/cypress/**', '**/.{idea,git,cache,output,temp}/**', '**/{karma,rollup,webpack,vite,vitest,jest,ava,babel,nyc,cypress,tsup,build}.config.*', './src/tests/**']
}
})
-
测试结果3
includeSource
-
Type:
-
string[]
-
-
default
-
[]
-
-
功能
-
Vitest 将运行所有包含
import.meta.vitest
的匹配文件
-
-
代码配置
/// <reference types="vitest" />
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
// https://vitejs.dev/config/
export default defineConfig({
plugins: [vue()],
test: {
exclude: ['**/node_modules/**', '**/dist/**', '**/cypress/**', '**/.{idea,git,cache,output,temp}/**', '**/{karma,rollup,webpack,vite,vitest,jest,ava,babel,nyc,cypress,tsup,build}.config.*', './src/tests/**'],
includeSource: []
}
})
-
测试结果1
-
配置代码2
/// <reference types="vitest" />
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
// https://vitejs.dev/config/
export default defineConfig({
plugins: [vue()],
test: {
exclude: ['**/node_modules/**', '**/dist/**', '**/cypress/**', '**/.{idea,git,cache,output,temp}/**', '**/{karma,rollup,webpack,vite,vitest,jest,ava,babel,nyc,cypress,tsup,build}.config.*'],
includeSource: ['./src/tests/**']
}
})
-
测试结果2
server
-
Type:
-
{ sourcemap?, deps?, … }
-
-
Version:
-
Since Vitest 0.34.0
-
Vite-Node 服务器选项。
server.sourcemap
-
Type:
-
'inline' | boolean
-
-
Default:
-
'inline'
-
-
功能
-
将内联源映射注入到模块中。
-
-
配置代码1
/// <reference types="vitest" />
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
// https://vitejs.dev/config/
export default defineConfig({
plugins: [vue()],
test: {
exclude: ['**/node_modules/**', '**/dist/**', '**/cypress/**', '**/.{idea,git,cache,output,temp}/**', '**/{karma,rollup,webpack,vite,vitest,jest,ava,babel,nyc,cypress,tsup,build}.config.*'],
includeSource: ['./src/tests/**'],
server: {
sourcemap: true
}
}
})
-
测试结果1
-
配置代码2
/// <reference types="vitest" />
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
// https://vitejs.dev/config/
export default defineConfig({
plugins: [vue()],
test: {
exclude: ['**/node_modules/**', '**/dist/**', '**/cypress/**', '**/.{idea,git,cache,output,temp}/**', '**/{karma,rollup,webpack,vite,vitest,jest,ava,babel,nyc,cypress,tsup,build}.config.*'],
includeSource: ['./src/tests/**'],
server: {
sourcemap: false
}
}
})
-
测试结果2
-
配置代码3
/// <reference types="vitest" />
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
// https://vitejs.dev/config/
export default defineConfig({
plugins: [vue()],
test: {
exclude: ['**/node_modules/**', '**/dist/**', '**/cypress/**', '**/.{idea,git,cache,output,temp}/**', '**/{karma,rollup,webpack,vite,vitest,jest,ava,babel,nyc,cypress,tsup,build}.config.*'],
includeSource: ['./src/tests/**'],
server: {
sourcemap: "inline"
}
}
})
-
测试结果3
server.debug
-
Type:
-
{ dumpModules?, loadDumppedModules? }
-
-
dumpModules
-
Type:
- boolean | string
-
功能
- 将转换后的模块转储到文件系统。传递字符串将转储到指定路径
-
-
loadDumppedModules
-
Type:
- boolean
-
功能
- 只要存在,就从文件系统中读取转储的模块。通过修改文件系统的转储结果可用于调试
-
-
配置代码1
/// <reference types="vitest" />
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
// https://vitejs.dev/config/
export default defineConfig({
plugins: [vue()],
test: {
exclude: ['**/node_modules/**', '**/dist/**', '**/cypress/**', '**/.{idea,git,cache,output,temp}/**', '**/{karma,rollup,webpack,vite,vitest,jest,ava,babel,nyc,cypress,tsup,build}.config.*'],
includeSource: ['./src/tests/**'],
server: {
sourcemap: "inline",
debug: {
dumpModules: true,
loadDumppedModules: true,
}
}
}
})
-
测试结果1
server.deps
-
Type:
-
{ external?, inline?, … }
-
-
功能
-
处理依赖关系解析。
-
-
server.deps.external
-
Type:
- (string | RegExp)[]
-
Default:
- [/\/node_modules\//]
-
功能
-
外部化(Externalize)是指Vite将包绕过到原生Node。
-
外部化依赖不会应用于 Vite 的转换器和解析器,因此它们不支持重新加载时的 HMR。
-
默认情况下,
node_modules
内的所有包都被外部化。
-
-
-
server.deps.inline
-
Type:
- (string | RegExp)[] | true
-
Default:
- []
-
功能
-
Vite将处理内联模块。这可能有助于处理以 ESM 格式发送
.js
的包(Node 无法处理) -
如果
true
,每个依赖项都将被内联 -
默认情况下,
ssr.noExternal
中指定的所有依赖项都将内联。
-
-
-
配置代码
-
/// <reference types="vitest" /> import { defineConfig } from 'vite' import vue from '@vitejs/plugin-vue' // https://vitejs.dev/config/ export default defineConfig({ plugins: [vue()], test: { exclude: ['**/node_modules/**', '**/dist/**', '**/cypress/**', '**/.{idea,git,cache,output,temp}/**', '**/{karma,rollup,webpack,vite,vitest,jest,ava,babel,nyc,cypress,tsup,build}.config.*'], includeSource: ['./src/tests/**'], server: { sourcemap: "inline", debug: { dumpModules: true, loadDumppedModules: true, }, deps: { inline: true } } } })
测试结果
-
server.deps.fallbackCJS
/// <reference types="vitest" />
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
// https://vitejs.dev/config/
export default defineConfig({
plugins: [vue()],
test: {
exclude: ['**/node_modules/**', '**/dist/**', '**/cypress/**', '**/.{idea,git,cache,output,temp}/**', '**/{karma,rollup,webpack,vite,vitest,jest,ava,babel,nyc,cypress,tsup,build}.config.*'],
includeSource: ['./src/tests/**'],
server: {
sourcemap: "inline",
debug: {
dumpModules: true,
loadDumppedModules: true,
},
deps: {
inline: true,
fallbackCJS: false
}
}
}
})
测试结果:设置为true或者false都会报错
-
server.deps.cacheDir
-
Type
string
-
Default:
- 'node_modules/.vite'
-
功能
- 保存缓存文件的目录。
-
问题:
- 和上一个一样,直接设置会报错
-