javascript - Webpack 导入，default.a 不是构造函数

Question

我知道这个问题已经在其他线程中得到解决，但是提供的解决方案都不适合我。我正在尝试将类从另一个项目导入到一个新的 react-create-app 项目，但是一些导入中断了

TypeError：react__WEBPACK_IMPORTED_MODULE_0___default.a 不是构造函数

这是有问题的类之一：

import React from 'react';
import Component from 'react';
import PropTypes from 'prop-types';
import shallowCompare from 'react-addons-shallow-compare';

class Pdf extends Component {
  constructor(props) {
    super(props);
    this.handlesOnTrashClick = this.handlesOnTrashClick.bind(this);
  }

  shouldComponentUpdate(nextProps, nextState) {
    return shallowCompare(this, nextProps, nextState);
  }

  render() {
    const {name, size} = this.props;
    return (
      <li style={{cursor:'pointer'}}>
        <span className="mailbox-attachment-icon">
          <i className="fa fa-file-pdf-o"></i>
        </span>
        <div className="mailbox-attachment-info">
          <span
            className="mailbox-attachment-name">
            {name}
          </span>
          <span className="mailbox-attachment-size">
            {size}
            <button
              className="btn btn-default btn-xs pull-right"
              onClick={this.handlesOnTrashClick}>
              <i className="fa fa-trash-o"></i>
            </button>
          </span>
        </div>
      </li>
    );
  }

  handlesOnTrashClick(evt) {
    evt.preventDefault();
    const { onTrashClick, name } = this.props;
    onTrashClick(name);
  }
}

Pdf.propTypes = {
  name: PropTypes.string.isRequired,
  filePath: PropTypes.string,
  size: PropTypes.any.isRequired,
  onTrashClick: PropTypes.func
};

Pdf.defaultProps = {
  filePath: ''
};

export default Pdf;

进口：

import React, { Component } from 'react'; //working
import PropTypes from 'prop-types'; //working
import { appConfig } from '../../../config'; //working

import Pdf from './pdf/Pdf'; //not working

欢迎任何想法，谢谢。

标签： javascriptwebpacknodes

Answer 1

问题来了，

import Component from 'react';

你应该像这样导入Component，

import { Component } from 'react';