在VS Code中组织导入会删除我的预导入

Question

对于JavaScript：

import { render, h } from "preact";

render(<p>Hello World!</p>, document.querySelector("#root"));

当我运行VS Code的Organize Imports命令时，h的导入被错误地删除了：

import { render } from "preact";

render(<p>Hello World!</p>, document.querySelector("#root"));

我该如何解决这个问题？

Answer 1

组织导入会删除未引用的导入。在这种情况下，VS Code不理解jsx元素隐式引用h。您需要告诉VS Code您正在使用h作为反应工厂函数

要解决此问题，请在项目的根目录中使用以下内容创建jsconfig.json：

{
  "compilerOptions": {
    "jsx": "react",
    "jsxFactory": "h",
  },
  "exclude": [
    "node_modules",
    "**/node_modules/*"
  ]
}

您可以找到有关这些设置的更多信息here。 jsxFactory可以设置为您的库用于构造jsx元素的任何名称空间，例如："h"或"React.createElement"