Babel-loader: Arrow function assignment build failed

Created on 24 Nov 2016  路  2Comments  路  Source: babel/babel-loader

class Test extends Component {

    constructor () {
        super();
    }

    test = ()=> {

    }

    render() {
        return (
            <button onClick = {this.test}>
                test
            </button>
        )

    }

}
  13 |     }
  14 | 
> 15 |     test = ()=>{
     |                ^
  16 |    
  17 |     }
  18 | 

Module build failed: SyntaxError: Unexpected token (15:18)

When I uesed react-scripts

test = ()=>{} is ok

But I want webapck

Most helpful comment

That error doesn't match up with what I see on https://babeljs.io/repl/#?babili=false&evaluate=true&lineWrap=false&presets=es2015&code=class%20Test%20extends%20Component%20%7B%0A%20%20%20%20test%20%3D%20()%20%3D%3E%20%7B%0A%20%20%20%20%20%20%20%20%0A%20%20%20%20%7D%0A%7D

class Test extends Component {
    test = () => {
         ^

    }
}

shows the issue. The issue is the test = X inside a class.

class Foo {
    test = 4;
}

would also give you an error. Assigning variables in a class is not standard ES6, it is https://babeljs.io/docs/plugins/transform-class-properties/ so you would need to install and enable babel-plugin-transform-class-properties or install one of the presets that include that experimental syntax.

All 2 comments

That error doesn't match up with what I see on https://babeljs.io/repl/#?babili=false&evaluate=true&lineWrap=false&presets=es2015&code=class%20Test%20extends%20Component%20%7B%0A%20%20%20%20test%20%3D%20()%20%3D%3E%20%7B%0A%20%20%20%20%20%20%20%20%0A%20%20%20%20%7D%0A%7D

class Test extends Component {
    test = () => {
         ^

    }
}

shows the issue. The issue is the test = X inside a class.

class Foo {
    test = 4;
}

would also give you an error. Assigning variables in a class is not standard ES6, it is https://babeljs.io/docs/plugins/transform-class-properties/ so you would need to install and enable babel-plugin-transform-class-properties or install one of the presets that include that experimental syntax.

Thanks

Was this page helpful?
0 / 5 - 0 ratings