Question

这是错误和控制台错误的图片...

我的代码似乎是正确的，并且导入的路径也很好，我不明白为什么会收到此错误。

App.js

import React, { Component } from 'react';
import {BrowserRouter, Route, Switch} from 'react-router-dom'
import Navbar from './components/layout/Navbar'
import Dashboard from './components/dashboard/Dashboard'


class App extends Component {
  render() {
    return (
      <BrowserRouter>
        <div className="App">
          <Navbar/>
          <Switch>
            <Route path="/" component={Dashboard}/>
          </Switch>
        </div>
      </BrowserRouter>
    );
  }
}

export default App;

Dashboard.js

import React, {Component} from 'react'
import Notifications from './Notifications'
import ProjectList from '../projects/ProjectList'

class Dashboard extends Component {
    render() {
        return(
            <div>
                <div className="dashboard container">
                    <div className="row">
                        <div className="col s12 m6">
                            <ProjectList/>
                        </div>
                        <div className="col s12 m5 offset-m1">
                            <Notifications/>
                        </div>
                    </div>
                </div>
            </div>
        )
    }
}

export default Dashboard

Notifications.js

import React from 'React'

const Notifications = () => {
    return(
        <div>
            <p>Notifications</p>
        </div>
    )
}

export default Notifications

ProjectList.js

import React from 'React'

const ProjectList = () => {
    return(
        <div>
            <div className="project-list section">
                <div className="card z-depth-0 project-summary">
                    <div className="card-content grey-text darken-3">
                        <span className="card-title">Project Title</span>
                        <p>Posted by Net Ninja</p>
                        <p className="grey-text">3rd September, 2018</p>
                    </div>
                </div>
            </div>
        </div>
    )
}

export default ProjectList

这也是我的目录设置的屏幕截图。

我也在使用npm start，我不知道使用yarn start是否会有所作为？

Answer 1

import React from 'React'

应该是

import React from 'react'

您正在尝试导入React而不是react。模块名称的大小写很重要

Answer 2

Notification.js

import React from 'react'

const Notifications = () => {
return(
    <div>
        <p>Notifications</p>
    </div>
)
}

 export default Notifications

ProjectList.js

 import React from 'react'

 const ProjectList = () => {
 return(
    <div>
        <div className="project-list section">
            <div className="card z-depth-0 project-summary">
                <div className="card-content grey-text darken-3">
                    <span className="card-title">Project Title</span>
                    <p>Posted by Net Ninja</p>
                    <p className="grey-text">3rd September, 2018</p>
                </div>
            </div>
        </div>
    </div>
)
}

export default ProjectList

模块名称不是React，因为导入是区分大小写的，从“ React”导入React会导致错误

Answer 3

我认为您需要使用以下命令来安装react-router-npm install react-router-dom

点击此链接以获取更多详细信息。（https://reacttraining.com/react-router/web/guides/quick-start）

Answer 4

所以问题是因为您没有正确导入。就像我的情况一样：

import {Dropdown} from 'react-Bootstrap'

我将其更正为

import {Dropdown} from 'react-bootstrap'

由于import语句区分大小写

Answer 5

我遇到了同样的问题，这是因为我导入了React而不是react 所以它应该像这样..

import React from 'react'

Answer 6

您的导入语句需要阅读class Follow(models.Model): follower = models.ForeignKey(User, related_name = 'follow_from_set', on_delete = models.CASCADE) following = models.ForeignKey(User, related_name = 'follow_to_set', on_delete = models.CASCADE) created = models.DateTimeField(auto_now_add=True)

您大写了。

Answer 7

我遇到了同样的问题。问题是编译过程使用缓存来优化构建时间。这是“Babel Loader”的内部事物。为确保您通过 webpacker/babel 获得完全刷新的编译过程，请删除文件夹“node_modules/.cache”并再次运行 npm start。

Answer 8

您可以从 Web-brackets.com 尝试此解决方案
您需要做的只是重命名从 React 导入的库，以对像这样的小 r 做出反应（在第一行）

import React from 'react';

参考 https://web-brackets.com/discussion/6/-solved-cannot-find-file-index-js-does-not-match-the-corresponding-name-on-disk-react-js

Answer 9

包括命名文件时，例如您导入 App 但文件上的名称是 app.js 这不会让系统找到相同的名称。

错误：找不到文件：'index.js'与磁盘上的相应名称不匹配：'./node_modules/React/react'

9 个答案: