Question

据我所知，我有正确的.babelrc和webpack.config设置，但仍然使模块构建失败：npm start上的SyntaxError。

    ERROR in ./src/components/Nav.js
    Module build failed: SyntaxError: /Users/me/project/src/components/Nav.js: Unexpected token (24:69)
      22 |             <LoadingButton className="btn--nav" />
      23 |           ) : (
    > 24 |             <a href="#" className="btn btn--login btn--nav" onClick={::this._logout}>Logout</a>
         |                                                                      ^
      25 |           )}
      26 |         </div>
      27 |       ) : (

我的.babelrc文件如下：

{
  "presets": ["react", "es2015", "stage-1"],
  "env": {
    "development": {
      "presets": [
        "react-hmre"
      ]
    },
    "production": {
      "plugins": [
        "transform-react-constant-elements",
        "transform-react-remove-prop-types"
      ]
    }
  }
}

和webpack.config文件（缩写）：

module: {
            loaders: [
              {test: /\.js$/, loader: 'babel', exclude: path.join(__dirname, '/node_modules/'), include: path.join(__dirname, 'src')},
              {test: /\.eot(\?v=\d+.\d+.\d+)?$/, loader: 'file'},
              {test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: "url-loader?limit=10000&mimetype=application/font-woff"},
              {test: /\.ttf(\?v=\d+.\d+.\d+)?$/, loader: 'file-loader?limit=10000&mimetype=application/octet-stream'},
              {test: /\.svg(\?v=\d+.\d+.\d+)?$/, loader: 'file-loader?limit=10000&mimetype=image/svg+xml'},
              {test: /\.(jpe?g|png|gif)$/i, loaders: ['file']},
              {test: /\.ico$/, loader: 'file-loader?name=[name].[ext]'},
              {test: /(\.css|\.scss)$/, loaders: ['style', 'css?sourceMap', 'postcss', 'sass?sourceMap']}
            ]
          }

有人可以在这里指出我的错误吗？

Answer 1

绑定运算符::不包含在ES6（也称为ECMA2015）中，它只是一种建议的语言功能。您正在为ECMA2015（es2015）使用babel预设，因此它不会将::识别为有效的运算符。只需使用好的ol＆＃39;就可以轻松解决这个问题。 .bind功能或箭头功能来捕捉这个＆＃39;上下文。

所以，而不是写onClick={::this._logout}

你可以写：

1）onClick={ this._logout.bind(this) }

2）onClick={ () => { this._logout() } }

无法解决＆＃34;模块构建失败：SyntaxError :: Unexpected token＆＃34;错误

1 个答案: