“无法在模块外部使用import语句” /“未定义导出”。无法使用React和Babel导入/导出功能

时间:2020-06-01 00:08:16

标签: javascript html reactjs import babeljs

我正在尝试在reactFile.js中导出一个函数,以便可以在script.js中调用它。但是,有些错误阻止我执行这些操作。我尝试了多种导出函数的方法,但还是没有运气。不知道如何解决它。谢谢。

HTML:

<script src='./script.js'></script>
<script src="https://unpkg.com/react@16/umd/react.development.js" crossorigin></script>
<script src="https://unpkg.com/react-dom@16/umd/react-dom.development.js" crossorigin></script>
<script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>
<script type="text/babel" type ="module"src="reactFile.js"></script>

reactFile.js

'use strict';

class Article extends React.Component {
    render() {
        return (
            <div className='news'>
                <a href={this.props.link}>
                    <h3>{this.props.title}</h3>
                </a>
                <p>{this.props.description}</p>
            </div>
        );
    }
}

const renderArticle = (title, description, link) => {
    const element = (
        <Article title={title} description={description} link={link} />
    );
    const domContainer = document.getElementById('breaking-news');
};

export { renderArticle };

script.js

import { renderArticle } from './reactFile.js';

我得到的错误:

Uncaught SyntaxError: Cannot use import statement outside a module

reactFile.js:1 Uncaught ReferenceError: exports is not defined
    at <anonymous>:3:23
    at i (babel.min.js:24)
    at r (babel.min.js:24)
    at e.src.n.<computed>.l.content (babel.min.js:24)
    at XMLHttpRequest.n.onreadystatechange (babel.min.js:24)

0 个答案:

没有答案