vscode 导入 import console = require("console");自动地

Question

import console = require("console");

console.

（我认为这是我的扩展之一。可能更漂亮。）

编辑： 它只发生在 React Typescript 环境中。不在 Typescript 中没有反应。

Answer 1

如果您添加一个用于插入 console.log 的 sn-p 并改用它，则不会自动导入“控制台”

https://code.visualstudio.com/docs/editor/userdefinedsnippets#_create-your-own-snippets

这是我的 sn-p：

{
    "Print to console": {
        "prefix": "cl",
        "body": [
            "console.log('$1');",
        ],
        "description": "Log output to console"
    }
}

Answer 2

我发现的最优雅的解决方案是在项目的某处创建虚拟 console.d.ts 文件：

declare module 'console' {
    export = typeof import("console");
}

这将阻止自动导入。

致谢：https://github.com/Microsoft/TypeScript/issues/30471#issuecomment-474963436

Answer 3

免责声明：这不应被视为“解决方案”，但它是最简单/最快的。

此答案假设您使用的是 VSCode。其他 IDE 应该类似。

1. 开始输入console
2. 点击回车或输入.，允许IntelliSense添加import console = require("console");
3. Ctrl+单击（或 F12，或 Cmd+单击 macOS）require("console")
4. 注释掉这段代码：

declare module "console" {
    export = console;
}

Answer 4

防止这种情况发生的一种方法是修改 tsconfig.json 文件以限制自动导入项目的类型集。

我遇到了同样的问题，我通过添加解决了它：

types: []

进入我的 tsconfig.json 文件。这样做是禁止 TypeScript（以及扩展名 VSCode）自动将所有带有 @types/ 的节点包导入到项目配置中。如果您使用这些类型显式导入包，这不会阻止 TS 导入这些类型定义。

在我的具体情况下，console 定义来自 @types/node，它已作为 Storybook 的依赖项导入到项目中。但是，我的项目是一个 webpack 项目，旨在在浏览器中运行，因此将 Node.js 类型导入我的源代码是没有意义的。您希望在浏览器中使用的基本类型集是 dom 类型，而不是节点类型。

根据您的项目，您可能必须将一组基本类型包显式添加到 types 参数中（types: ["dom", "react"] 等）。然而，在我的情况下，这被证明是不必要的，我的项目能够用一个空列表很好地编译。 VSCode 自动导入“控制台”的趋势似乎已经完全消失了；到目前为止，我还没有注意到任何其他不良影响。

更多关于在 tsconfig.json 中设置类型的信息：https://www.typescriptlang.org/docs/handbook/tsconfig-json.html

Answer 5

如果你和我一样忘记了“cl”，可以在sn-ps中使用多个前缀:)

{
    "Print to console": {
        "prefix": ["cl","co","con","cons","conso","consol","console", "console.l","console.lo","console.log"],
        "body": [
            "console.log($1);",
        ],
        "description": "Log output to console"
    }   
}

Answer 6

我也遇到过这种情况，这似乎是 VSCode 中的自动导入功能的问题。禁用所有扩展似乎也不会让它消失。

作为一种解决方法，您可以在设置中禁用自动导入。

如果您使用 Javascript

“javascript.suggest.autoImports”：假

如果你使用 Typescript

“typescript.suggest.autoImports”：假

编辑：错误的自动导入发生是因为此代码在依赖关系树下的包中

declare module "console" {
    export = console;
}

该包可以位于本地 node_modules 目录中，也可以位于全局安装的引用包中。

1. 在本地 node_modules 中搜索 declare module "console"
2. 如果您在本地包中找到它，请运行 npm list [packageName] 以确定 package.json 中的哪个包依赖于其中包含控制台代码的包。

如果您在本地 node_modules 中找不到代码，您也可以

1. 在package.json中一一消除包

2. 在全局安装的模块中搜索控制台代码，您的项目中的包可能会引用这些模块

%USERPROFILE%\AppData\Roaming\npm\node_modules %USERPROFILE%\AppData\Local\Microsoft\TypeScript

我知道这不是一个直接的解决方案，但我希望它有所帮助，在我的情况下，我有一个来自 react-native-copilot -> rimraf -> 节点的参考，其中包含控制台代码。删除 react-native-copilot 解决了这个问题。