Reactjs typescript react-奇怪的组件导入问题

Reactjs typescript react-奇怪的组件导入问题,reactjs,typescript,Reactjs,Typescript,我一直在学习react中的typescript,我不断遇到这些奇怪的导入问题。我所有的组件导入都出现了这种情况 下面是一个简单的导入: 从../components/layout/MainNav/MainNavBar导入MainNav 以及进口货物的内容: import React from "react"; import classNames from "classnames"; const MainNavBar:React.SFC = () => { const classes

我一直在学习react中的typescript,我不断遇到这些奇怪的导入问题。我所有的组件导入都出现了这种情况

下面是一个简单的导入:

从../components/layout/MainNav/MainNavBar导入MainNav

以及进口货物的内容:

import React from "react";
import classNames from "classnames";

const MainNavBar:React.SFC = () => {
  const classes = classNames (
    "main-navbar",
    "bg-white"
  );
  return (
    <div className={classes}>
        <nav>
          <li>Item 1</li>
          <li>Item 2</li>
        </nav>
    </div>
  );
}

export default MainNavBar;

这是因为默认情况下,macOS在其文件系统中使用不区分大小写的文件名。这混淆了打字脚本。在具有区分大小写的文件名的环境中,这将导致致命错误—它将无法找到该文件

解决方案是只使用与路径中相同的套管:

import MainNav from "../components/layout/MainNav/MainNavBar";

mainNav应该是mainNav,但我确实觉得很奇怪。。。我的“MainNav”文件夹显式为“MainNav”。我提供的管柱与我的结构完全相同。将子文件夹更改为“MainNav”会引发循环,因为之前的文件夹或之后的任何子文件夹会怎么样?这确实解决了我的问题。这真的很奇怪,这就是为什么我更喜欢区分大小写的文件系统——没有这样的混淆。项目是由您创建的,包括MainNav文件夹吗?正确-我找到了一个有效的解决方案。我刚刚关闭了vscode并重新构建了我的应用程序,它工作得很好!了解这一点将有助于避免将来的错误!
import MainNav from "../components/layout/MainNav/MainNavBar";