"Cannot set property" error on React class component method

[AndrewRayCode]

I'm guessing I'm missing something but not sure what.

My .babelrc:

{
  "presets": ["react", "es2015", "stage-0"],

  "plugins": [
    "transform-decorators-legacy"
  ],

  "env": {
    "development": {
      "plugins": [ "typecheck" ]
    }
  }
}

My webpack loader config:

{
    test: /\.jsx?$/,
    exclude: /node_modules/,
    loaders: [ 'react-hot', 'babel?presets[]=es2015&presets[]=react&presets[]=stage-0&plugins[]=transform-decorators-legacy' ]
}

My .eslintrc (I have no idea if both of these are needed):

  "parser": "babel-eslint",
  "settings": {
    "import/parser": "babel-eslint",

In my React component, I use the autobind decorator:

import autobind from 'autobind-decorator';

export default class Home extends Component {

    @autobind
    onPress() {}

}

But I get the runtime error:

makeAssimilatePrototype.js:21 Uncaught TypeError: Cannot set property onPress of # which has only a getter

[InfernoZeus]

Just started getting this issue as well - no idea what's triggered the change. The only thing I did was extract a class into its own file, but I don't think that caused it.

[AndrewRayCode]

@InfernoZeus what version of React are you using? Wondering if component classes changed something internally recently. Or maybe how Babel handles classes?

For me:
React 15.2.1
babel-core 6.11.4

[InfernoZeus]

I'm using the same version of React, and a slightly earlier version of babel-core: 6.10.4

[VinceFanZ]

I've had the same problem.

[VinceFanZ]

user import { autobind } from 'core-decorators'

[smashercosmo]

gaearon/react-transform-catch-errors#26 probably related

[alexilyaev]

@VinceFanZ Did not work for me with core-decorators

[Jinnified]

@smashercosmo if my dependency's dependency has react-transform-catch-errors and i have transform-decorators-legacy, could this still causing issues?

[alexilyaev]

This might be related:
jayphelps/core-decorators#48 (comment)

[iamricky]

I'm still receiving the Uncaught TypeError: Cannot set property render of #<ComponentName> which has only a getter when binding to the class, e.g.

@autobind
class Component { }

Has this issue been addressed? Please advise.

source:
https://github.com/gaearon/react-transform-catch-errors/issues/26#issuecomment-197078851

[AndrewRayCode]

I think this project is abandonware that will only work with older versions of something (babel? react?)

[stevemao]

See #29

[silent-tan]

met the same problem, anything else solution?

[smashercosmo]

I fixed it long time ago in react-transform-catch-errors gaearon/react-transform-catch-errors@afbbda8 It just wasn't published. Installing directly from master should work for everyone who faced this issue.

[stevemao]

98968ee should have fixed this. Please try the latest master branch :)

[alexilyaev]

With react-hot-loader 3 this worked with version v1.4.1 as well.
Tested now with v2.1.0, still works.