| translateHelp | true |
|---|
每个插件都会对应一个 id 和一个 key,id 是路径的简写,key 是进一步简化后用于配置的唯一值。
比如插件 /node_modules/@umijs/plugin-foo/index.js,通常来说,其 id 为 @umijs/plugin-foo,key 为 foo。
插件有多种启用方式,
Umi 会自动检测 dependencies 和 devDependencies 里的 umi 插件,比如:
{
"dependencies": {
"@umijs/preset-react": "1"
}
}那么 @umijs/preset-react 会自动被注册,无需在配置里重复声明。
在配置里可通过 presets 和 plugins 配置插件,比如:
export default {
presets: ['./preset', 'foo/presets'],
plugins: ['./plugin'],
}通常用于几种情况:
- 项目相对路径的插件
- 非 npm 包入口文件的插件
注意:
- 请不要配置 npm 包的插件,否则会报重复注册的错误
还可通过环境变量 UMI\_PRESETS 和 UMI\_PLUGINS 注册额外插件。
比如:
$ UMI_PRESETS=/a/b/preset.js umi dev注意:
- 项目里不建议使用,通常用于基于 umi 的框架二次封装
可以执行以下命令,
$ umi plugin list
# 顺便看看他们分别用了哪些 key
$ umi plugin list --key结果通常如下,
Plugins:
- @umijs/preset-built-in [key: builtIn] (preset)
- @@/registerMethods [key: registerMethods]
- @@/routes [key: routes]
- @@/generateFiles/core/history [key: history]
- @@/generateFiles/core/plugin [key: plugin]
- @@/generateFiles/core/routes [key: routes]
- ...可通过 api.hasPlugins(pluginId[]) 和 api.hasPresets(pluginId[]) 的方式感知其他插件,详见插件 API。
有两种方式可禁用插件,
比如:
export default {
mock: false,
}会禁用 Umi 内置的 mock 插件及其功能。
可通过 api.skipPlugins(pluginId[]) 的方式禁用,详见插件 API。
通过插件的 key 来配置插件,比如:
export default {
mock: { exclude: ['./foo'] }
}这里的 mock 是 mock 插件的 key。
再比如我们安装一个插件 umi-plugin-bar,其 key 默认是 bar,就可以这么配置,
export default {
bar: { ...balabala },
}