时间戳

首页 > 解决方案 > react-collapsible 编译失败

javascript - react-collapsible 编译失败

问题描述

我正在从事 spring+reactJS 项目，目前正在从事前端工作（该领域的初学者）。

通常我会尝试从“REACT-COLLAPSIBLE”创建简单的手风琴。

代码很简单：JS文件：

import React, { Component } from 'react';
import { Link } from "react-router-dom";
import '../index.css';
import Collapsible from "react-collapsible/src/Collapsible";


class Author extends Component {

    constructor(props) {
        super(props);
    }

    render() {
        return (

            <Collapsible trigger="Start here">
                <p>This is the collapsible content. It can be any element or React component you like.</p>
                <p>It can even be another Collapsible component. Check out the next section!</p>
            </Collapsible>

        );
    }

}
export default Author;

我已经安装了react-collapsible并且我在package.json中有适当的依赖关系

当我尝试编译此代码时，出现编译错误：

Failed to compile.

./node_modules/react-collapsible/src/Collapsible.js
Module parse failed: Unexpected token (116:8)
You may need an appropriate loader to handle this file type.
|     if (this.props.triggerSibling && typeof 
this.props.triggerSibling === 'string') {
|       return (
|         <span className={`${this.props.classParentString}__trigger- 
sibling`}>{this.props.triggerSibling}</span>
|       )
|     } else if(this.props.triggerSibling) {

当然，这只是项目的一部分，除了这部分一切正常。我不知道我该怎么做，如果错误与代码的其他部分有关，这可能有用，请告诉我。

反应可折叠模块有问题吗？我该怎么办？当我安装它时，我没有收到任何警告，应该添加其他依赖项

标签： javascriptjavareactjsdependenciesreact-component

解决方案

将您的导入更改为import Collapsible from "react-collapsible";

您正在从已处理的src而不是dist已处理的中导入。

如果您签出此模块的 package.json，您将看到默认导出的文件是dist/Collapsible.js.

推荐阅读