首页 > 解决方案 > VSCode添加所有缺少的导入不起作用

问题描述

例如,我创建了一个新的 create-react-app 并从 index.js 中删除了 App 导入。ESLint 显示了问题,我可以通过单击 App 并按“Ctrl + Space”或“Ctrl +”来修复它。并单击导入应用程序,但我希望在保存时导入文件。

源操作 > 添加所有缺失的导入不起作用,但有趣的是组织导入。

我不知道可能是什么问题。我想使用组织导入并在保存时添加缺少的导入。

我的 Settings.json

+ 一件事我意识到 vs 代码根本无法判断缺少哪些文件,因为当我删除自动导入扩展时 ctrl + space 和 ctrl + 。停止工作。

{
    "workbench.iconTheme": "vscode-icons",
    "liveServer.settings.donotShowInfoMsg": true,
    "window.zoomLevel": 1,
    "git.enableSmartCommit": true,
    "eslint.format.enable": true,
    "editor.formatOnSave": true,
    "javascript.updateImportsOnFileMove.enabled": "always",
    // "files.autoSave": "afterDelay",
    "diffEditor.renderSideBySide": false,
    "[javascript]": {
        "editor.defaultFormatter": "esbenp.prettier-vscode"
    },
    "explorer.confirmDragAndDrop": false,
    "emmet.triggerExpansionOnTab": true,
    "emmet.includeLanguages": {
        "javascript": "javascriptreact"
    },
    "emmet.syntaxProfiles": {
        "javascript": "jsx"
    },
    "prettier.arrowParens": "always",
    "editor.fontLigatures": true,
    "workbench.activityBar.visible": true,
    "workbench.preferredDarkColorTheme": "One Dark Pro",
    "oneDarkPro.bold": true,
    "oneDarkPro.editorTheme": "Onedark Pro",
    "oneDarkPro.vivid": true,
    "workbench.preferredHighContrastColorTheme": "One Dark Pro",
    "workbench.preferredLightColorTheme": "One Dark Pro",
    "workbench.colorTheme": "One Dark Pro",
    "editor.fontFamily": "Fira Code, Fira Code iScript, Consolas, 'Courier New', monospace",
    "gitlens.advanced.messages": {
        "suppressCommitHasNoPreviousCommitWarning": true
    },
    "eslint.workingDirectories": [{ "mode": "auto" }],
    "prettier.trailingComma": "es5",
    "autoimport.filesToScan": "**/*.{jsx,js,ts,tsx}",
    "autoimport.doubleQuotes": true,
    "autoimport.showNotifications": true,
    "explorer.compactFolders": false,
    "eslint.codeAction.showDocumentation": {
        "enable": true
    },
    "[typescriptreact]": {
        "editor.defaultFormatter": "esbenp.prettier-vscode"
    },
    "typescript.tsdk": "",
    "path-intellisense.mappings": {},
    "relativePath.excludedExtensions": [".js"],
    "typescript.updateImportsOnFileMove.enabled": "always",
    "typescript.preferences.includePackageJsonAutoImports": "on",
    "prettier.useTabs": true,
    "editor.codeActionsOnSave": {
        "source.addMissingImports": true
        // "source.fixAll.eslint": true
        // "source.organizeImports": true
    },
    "editor.snippetSuggestions": "top"
}

标签: visual-studio-codeimportauto

解决方案


请在您的应用程序的根目录中创建一个新的 jsconfig.json 文件,其中包含:

{
  "compilerOptions": {
    "baseUrl": "./src",
    "checkJs": true,
    "jsx": "react"
  }
}

然后尝试:

import React from 'react'

const Component = () => {
  const [test] = useState(0)

  return <div>{test}</div>
}

export default Component

推荐阅读