Question

button.js

import React, { Component } from "react";

class ButtonElements extends Component {
  render() {
    return (
      <button type={this.props.btnType} onClick={this.props.click}>
        {this.props.btnText}
      </button>
    );
  }
}

export default ButtonElements;

text.js

import React from "react";

const TextElement = props => <h2>{props.label}</h2>;

export default TextElement;

index.js

import ButtonElements from "./component/button/button";
import TextElement from "./component/text/text";

export { ButtonElements, TextElement };

webpack.config.js

module.exports = {
  mode: "production",
  entry: ["./src/index.js"],
  output: {
    path: path.resolve("lib"),
    filename: "index.js",
    libraryTarget: "commonjs2"
}

我的项目：

import ButtonElements from "npm-package";
import TextElement from "npm-package";

<ButtonElements iClass="faSort" btnText="T"></ButtonElements>
<TextElement label="T"></TextElement>

错误：元素类型无效：预期为字符串（对于内置组件）或类/函数（对于复合组件），但得到：未定义。您可能忘记了从定义文件中导出组件，或者可能混淆了默认导入和命名导入

Answer 1

import { ButtonElements } from "npm-package";

反应-获取错误导出多个组件用作NPM包

1 个答案: