实施ReactJS成角应用

Question

我的工作在网站上，并试图包括ReactJS成分，我做它像这样：

import React from "react"; 
import ReactDOM from "react-dom"; 
import Layout from "Layout.jsx"; 

const app = angular.module('myApp'); 

const reactDirective = app.directive('reactDirective', function() { 

    return { 
     template: '<div id="reactapp"></div>', 
     link: function(scope, el, attrs){ 
      ReactDOM.render(<Layout/>, document.getElementById('reactapp')); 
     } 
    } 
}); 

和Layout.jsx

import React from 'react'; 
export default class Layout extends React.Component { 
    constructor(props){ 
     super(props); 
    } 
    render() { 
     return (
      <div> 
       This is ReactJS 
      </div> 
     ); 
    } 
} 

然而每当它编译，它给我
ERROR in ./react-app.js Module not found: Error: Cannot resolve module 'layout.jsx'
任何人都可以告诉我什么是我的代码错了吗？

Answer 1

导入不在node_modules中的本地文件必须是相对路径。

import Layout from "./Layout.jsx";