爲什麼當我試圖使用React從另一個文件中導入一個類時出現空白屏幕

因此，我是React框架的新成員，並且遇到了一個問題，我在調試時遇到了問題。爲什麼當我試圖使用React從另一個文件中導入一個類時出現空白屏幕

我想從我的項目中的另一個文件中的另一個組件導入到我的app.js.此課程現在不做任何事情，但在頁面上顯示文本「我的項目」。

當我使用<Projects/>在app.js中實例化它時，我的應用程序從顯示app.js（我的應用程序）中的文本轉到空白白屏。

我期待它在下一行顯示文本「我的應用程序」，然後「我的項目」。我錯過了什麼？

這裏是app.js：

import React, { Component } from 'react'; 
import Projects from './Components/Projects'; 
import './App.css'; 

class App extends Component { 
render() { 
    return (
    <div className="App"> 
    My App 
    <Projects/> 
    </div> 
    ); 
    } 
} 

export default App;

這裏是Projects.js：

invariant.js:44 Uncaught Error: Invalid tag: data:application/octet-stream;base64,aW1wb3J0IFJlYWN0LCB7IENvbXBvbmVudCB9IG…MKICAgICAgPC9kaXY+IAogICAgKTsKICB9Cn0KZXhwb3J0IGRlZmF1bHQgUHJvamVjdHM7Cg== 
at invariant (invariant.js:44) 
at validateDangerousTag (ReactDOMComponent.js:345) 
at new ReactDOMComponent (ReactDOMComponent.js:372) 
at Object.createInternalComponent (ReactHostComponent.js:41) 
at instantiateReactComponent (instantiateReactComponent.js:79) 
at instantiateChild (ReactChildReconciler.js:44) 
at ReactChildReconciler.js:71 
at traverseAllChildrenImpl (traverseAllChildren.js:77) 
at traverseAllChildrenImpl (traverseAllChildren.js:93) 
at traverseAllChildren (traverseAllChildren.js:172)

：

import React, { Component } from 'react'; 

class Projects extends Component { 
    render() { 
    return (
     <div className="Projects"> 
     My Projects 
     </div> 
    ); 
    } 
} 

export default Projects;

這裏從開發者控制檯來的錯誤這裏是產品結構圖：

http://imgur.com/a/BKTK3

來源

2017-07-27 AutomationKen

您是否在開發人員控制檯中看到任何錯誤？ – idmean

你能爲我們提供項目結構嗎？ – Roman

您顯示的代碼按預期工作：https://codesandbox.io/s/j2nlop4ov也許問題是由您的應用的其他部分引起的。 – marzelin