VSCode 自动导入 - 如何强制 Material-UI 全路径导入

Question

当使用 VSCode 的自动导入功能导入 Material-UI 组件时，它将使用命名导入从顶级文件导入：

import { Button } from "@material-ui/core"

但是，我希望自动导入使用完整路径导入：

import Button from "@material-ui/core/Button

我试图找到一种方法来配置 VSCode 的自动导入来执行此操作，但无济于事。

有谁知道这是否可能/如何配置？

Answer 1

您可以通过安装 来更改 vscode 中材质 UI 导入的类型material-ui-snippets。您可以按照此处的说明进行操作

进入扩展设置，首先检查然后根据您的喜好Material-ui-snippets: Add Completion Imports更改类型。Material-ui-snippets: Import Paths（在你的情况下，它会是second level）

导入路径

• auto - 如果找到其他顶级导入，则使用顶级，否则使用第二级
• 顶层 - 从 '@material-ui/core' 导入 { Button }
• 第二级 - 从“@material-ui/core/Button”导入按钮

编辑：
上述扩展对 MUI 4 有效。
此扩展的文档建议对 MUI 5 使用mui-snippets。