PhpStorm 无法解析包导入,即使它存在(react-router-dom)

2024-01-07

我正在使用 React (16.12.0) 和 PhpStorm (2019.3.1)。

我导入的包是react-router-dom(5.1.2)

我将编写以下导入:

import { NavLink, Switch } from "react-router-dom";

这两个包都由 webpack/babel 正确导入,并且当我同时使用 Switch 和 NavLink 时页面正确呈现。

然而纯粹从 IDE 的角度来看,我收到了有关 Switch 的警告:Cannot resolve symbol 'Switch'

这很奇怪,因为它显然在那里,而且我签入了/node_modules/react-router-dom and Switch.js有没有。

奇怪的是,在 PhpStorm 的早期版本(在几次更新和插件导入以及其他更改之前),PhpStorm 准确地找到了 Switch 导入。

我最近没有更新react-router-dom,并且正在使用其最新的稳定版本。

关于为什么它可能缺少 Switch 有什么想法吗?

EDIT:我意识到这可能是因为 PhpStorm 难以导入 commonJS 模块。

我尝试将 Javascript 编译方法从 React JSX 更改为 ECMA 6。但这不起作用。

我还尝试导入一些用于react-router-dom的构建库,这有助于识别Route奇怪地导入但不是Switch.

我还尝试使 PhpStorm 缓存无效并重新启动应用程序,但这也不起作用。

EDIT 2:根据答案,当我的光标位于react-router-dom尝试安装 typescript 包,但我没有得到与 JetBrains 网站上显示的相同的建议操作:https://www.jetbrains.com/help/webstorm/configuring-javascript-libraries.html https://www.jetbrains.com/help/webstorm/configuring-javascript-libraries.html

它所建议的是将单引号切换为双引号。

另外我已经安装了@types/react-router-dom。也许我还缺少另一件事?

EDIT 3:正确答案是安装@types/react-router。因为某些原因@types/react-router-dom欺骗性地不是解决这个问题的方法。


node_modules/react-router-dom/esm/react-router-dom.js出口BrowserRouter, HashRouter, Link and NavLink,但不导出Switch,那里没有明确定义。 为了更好地完成/类型提示,您可以为包安装 Typescript 存根:将光标放在"react-router-dom"在导入语句中,点击Alt+Enter, 选择安装 TypeScript 定义以获得更好的类型信息::

See https://www.jetbrains.com/help/webstorm/2019.3/configuring-javascript-libraries.html#ws_jsconfigure_libraries_ts_definition_files https://www.jetbrains.com/help/webstorm/2019.3/configuring-javascript-libraries.html#ws_jsconfigure_libraries_ts_definition_files

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

PhpStorm 无法解析包导入,即使它存在(react-router-dom) 的相关文章

  • 如何使用 angular-cli 调试 Angular2 中的应用程序?

    有谁知道是否可以通过命令行使用 angular cli 来调试应用程序ng serve在网络风暴中 我尝试了此网址中发布的解决方案 如何使用 Angular CLI Webpack 调试 Angular 2 应用程序 https stack
  • 将react-route-dom中的语法从“Switch”更改为“Routes”,但浏览器中仍然没有显示

    我正在创建一个 Google 克隆 这是我当前的代码 我读到 考虑到反应路由器的更新 我需要将语法从 Switch 更改为 Routes 我这样做了 但我的 这是搜索页面 没有显示在浏览器内部 import React from react
  • 如何记录 IDE 的魔术(_call 和 _callStatic)方法

    在使用 notepad 和 sublime 编码多年之后 有人建议我尝试一下 PHP IDE 我正在尝试 phpStorm 它看起来不错 代码完成和文档是一个很棒的功能 但在使用魔术方法时对我来说不起作用 有没有办法让 phpStorm 了
  • Mac 上 Docker 内的 Xdebug 无法工作

    我将本地开发设置从 Linux 移植到新的 Mac 机器 但在让 Xdebug 在 Mac M1 Pro 机器中与 PhpStorm 配合使用时遇到问题 我有一个包含 PHP 的容器 其中 Xdebug 安装并配置如下 zend exten
  • WebStorm/PHPStorm 中的智能选项卡有什么作用?

    我对智能选项卡在一般偏好中的作用感到困惑 它说 仅通过空格即可对必要的列进行精细对齐 如果 如果未选中此复选框 则使用空格进行对齐 必要的 这是否意味着在这两种情况下都使用空格来对齐 这是否意味着它总是在后者中使用空格 而仅有时在前者中使用
  • 如何自动生成已实现接口的方法

    PhpStorm 中是否有一种方法可以自动生成给定类正在实现的接口所需的空方法 假设我们有一个包含 3 个方法的接口 当定义实现该接口的新类时 一些选项可以为所有必需的方法自动生成容器 你当然可以 有 3 种方法可以做到这一点 Press
  • 在类 Illuminate\Support\Facades\Schema 中找不到方法“create”

    我使用的是 Laravel 5 3 在 PhpStorm 中 create 方法和许多其他方法下有错误 我尝试了所有 ide helpers 但没有解决问题 有没有办法解决这个问题和自动完成 我发现问题的答案在于使用行 use Illumi
  • 如何让 Webstorm 11 识别 HTML 脚本标签中的 ES2015 javascript

    当 WebStorm 11 位于常规 HTML 中的脚本标签内时 我一直无法识别 突出显示 解析 ES6 ES2015 javascript 找不到似乎适用于此的设置 在此先感谢您的时间 例如 以下 js 位于 script 标签内 您会注
  • Promise 完成后导出模块

    我实际上想将 read 函数放在不同的模块中 然后在我的主 app js 中需要它 我对使用承诺还很陌生 修改 var dir require node dir var files function getFiles return new
  • 在 phpstorm 中使用远程服务器 [关闭]

    Closed 这个问题需要多问focused help closed questions 目前不接受答案 我目前使用 Komodo 并直接在远程服务器上工作 我刚刚发现了 phpstorm 我想开始尝试一下 我的问题是 如何像科莫多那样在远
  • WebStorm已将目录中的所有文件标记为非项目文件

    WebStorm 已将我的项目子目录 根目录的服务器部分 中的所有文件标记为非项目文件 它发生在我转换到 Babel 然后又转换到 TypeScript 的过程中 我已经删除了 TypeScript 的内容 想知道这是否与该配置有关 我相信
  • 如何注释 .tsx 文件中的属性?

    给出以下 JSX 代码 div div 我怎样才能注释掉className my class className my class 不起作用 className my class 不起作用 TS1005 expected className
  • 在 PhpStorm 中禁用水平滚动

    有没有办法做到这一点 我更愿意将代码换行并表示在 80 100 个字符的行长度内 每次滑动时的滚动都让我发疯 有 软包裹 IDE 中的功能 它就是这样做的 它实际上 仅在屏幕上 将行分成多行以显示整行 而不需要水平滚动 它可以在以下位置启用
  • 如何避免 TypeScript 中出现虚假的“未使用参数”警告

    我遇到过很多次这种情况 最后决定弄清楚正确的方法是什么 如果我有一个声明方法的抽象父类 然后一些具体子类在其实现中实现真正的逻辑 并且显然使用方法参数 但某些子类不需要在该方法中执行任何操作 因此不要使用方法参数 那些不必执行任何操作的方法
  • 无法使用 webpack 加载 Node 原生插件

    虽然我正在使用vue cli在生成 webpack 配置的示例代码中 没有任何特定于 vue 的内容 我像这样创建示例应用程序 vue init webpack webpack modules example 生成webpack base
  • PHPStorm - 无效的后代文件名

    我正在尝试将 Windows 7 PC 上的本地 PHPStorm 项目与 Ubuntu 服务器同步 当我尝试任何类型的连接 例如 测试 SFTP 连接 时 它会失败并显示 Invalid descendent file name C np
  • 将项目中的node_modules集中到子项目中

    是否可以以在中心点上拥有所需模块的方式配置 grunt 我有以下项目结构 Project subproject subproject subproject 我通过 grunt 构建项目的所有子项目 并且我也可以为自己构建每个子项目 目前 我
  • 使用 ES6 `import` 语法时出现“无法解析符号”

    Here http www qimingweng com react modal dialog 给出了如何从模块导入某些类的示例 import ModalContainer ModalDialog from react modal dial
  • PhpStorm:如何将部署设置从一个项目导出到另一个项目?

    我需要将部署设置从一个项目导出到另一个项目 我怎样才能做到这一点 我尝试导出所有设置 File gt Export Settings 并将它们导入到新项目中 但我在部署服务器列表中没有可用的配置 复制两者 idea deployment x
  • 在 phpMyAdmin 上禁用 xDebug

    我是第一次使用 xDebug 一切都很顺利 但当我想继续时localhost phpmyadmin它想开始调试 我这里没有断点 如何仅对 phpmyadmin 禁用它 我的配置 XDebug zend extension C xampp p

随机推荐