导入在子文件夹中不起作用

Question

当我使用

import React from 'react';
import ReactDOM from 'react-dom';
require('./styles.css');
import App from './components/App';
import Test from './components/Test';

ReactDOM.render(
 <App />,
 document.getElementById('root')
);

webpack 在应用程序组件中找到了测试模块：

import React from 'react';
import Test from './components/Test';

export class App extends React.Component {
  render() {
    return (
      <div className='container'>
        <Test />
     </div>
    )
  }
}

导入测试不起作用它说： ./src/components/App.js 中的错误找不到模块：错误：无法解析'./components/Test'

虽然我使用 require 时它有效

var Test = require('./Test');

Answer 1

您从错误的目录导入。通过查看您的第一个代码，您在同一个 components 目录中同时拥有 App 和 Test。出现错误是因为您的导入在 components 文件夹中查找 components 文件夹。所以如果你想把它导入到应用程序中，你应该指定当前文件夹的相对路径。即）./

在您的应用 class 或 App.js 文件中尝试此操作

import Test from './Test';

导入在子文件夹中不起作用

import does not work in subfolder

javascript

reactjs

webpack

webpack-2