我正在使用ReactJS。

当我运行下面的代码时,浏览器会显示:

Uncaught TypeError:超级表达式必须为null或函数,不能为undefined

任何关于哪里出了问题的提示都会让我感激不尽。

首先是用来编译代码的行:

browserify -t reactify -t babelify examples/temp.jsx  -o examples/public/app.js

代码是:

var React = require('react');

class HelloMessage extends React.Component {
  render() {
    return <div>Hello </div>;
  }
}

更新: 在这个问题上在地狱火里燃烧了三天之后,我发现我没有使用react的最新版本。

全球安装:

sudo npm install -g react@0.13.2

在本地安装:

npm install react@0.13.2

确保浏览器使用正确的版本:

<script type="text/javascript" src="react-0.13.2.js"></script>

希望这能挽救别人三天宝贵的生命。


当前回答

我有这个问题,因为我的react和react-dom版本在合并后不匹配。

我手动输入我想要的版本号并重新运行npm install来修复它。

其他回答

使用Babel(5.8),如果我尝试将表达式export default与其他一些导出结合使用,我会得到相同的错误:

export const foo = "foo"
export const bar = "bar"
export default function baz() {}

我已经看到这个错误发生由于'评论'在包生成的webpack。在webpack.config.js中使用'pathinfo'= true会导致以下问题:

webpack.config.js

module.exports = {
  output: {
    pathinfo: true,
  }
}

'pathinfo'在开发中默认为true,在生产中默认为false 模式。https://webpack.js.org/configuration/output/#outputpathinfo 尝试将此值设置为false以解决问题。

如果您没有使用插件从构建输出中剥离注释,也会发生这种情况。尝试使用UglifyJs (https://www.npmjs.com/package/uglifyjs-webpack-plugin/v/1.3.0):

webpack.config.js

const UglifyJsPlugin = require('uglifyjs-webpack-plugin')

module.exports = {
  ...
  optimization: {
    minimizer: [new UglifyJsPlugin(
      new UglifyJsPlugin({
        uglifyOptions: {
          output: {
            comments: false
          }
        }
      }),
    )],
  }
}

这招对我很管用:

import React, {Component} from 'react';

我写

React.component

而不是React。组件 这是我的问题)) 为了这个找了半个多小时。

我的条件

Create-React-App React-scripts v3.2 Froala富文本编辑器v3.1 开发模式运行良好 产品构建因问题中提到的错误而中断

解决我问题的方法

将Froala降级到3.0版本。

3.1版中的某些内容破坏了我们的Create React应用程序构建过程。

更新:使用react脚本v3.3

我们发现在React Scripts 3.2和Froala 3.1之间有一个问题。

更新到React Scripts v3.3允许我们升级到Froala 3.1。