Acorn - почему функция со стрелкой выдает ошибку синтаксического анализа?

#javascript #acorn

Вопрос:

Я пытаюсь проанализировать исходный код старого компонента React с помощью Acorn.

Компонент для синтаксического анализа (ProjectNew2.js ):

 import React from 'react';

class ProjectNew extends React.Component {

    componentDidMount = () => {
        // do some stuff here...
    }

    render() {
        return (
            <div>fooo</div>
        );
    }

}

export default connect(mapStateToProps)(ProjectNew);

любой мой код JavaScript:

 #!/usr/bin/env node

const Fs = require('fs')
const acorn = require("acorn")
const jsx = require("acorn-jsx")

let fileName = "./ProjectNew2.js";
let cnt = Fs.readFileSync(fileName).toString()

let s = acorn.Parser.extend(jsx()).parse(cnt, {ecmaVersion: "latest", sourceType: "module"});

console.log(s)

и исключение:

Ошибка синтаксиса: неожиданный токен (21:22)

Вопрос: почему Acorn выдает исключение при разборе функции со стрелкой?

Когда я меняю синтаксический анализ на:

 componentDidMount(){
    // do some stuff here...
}

Acorn успешно анализирует ее.

Ответ №1:

Я полагаю, что проблема, с которой вы столкнулись, заключается в том, что поля класса являются предложением этапа 3 до TC 39 и еще не являются частью языка Javascript (даже если браузеры уже поддерживают их). Как и в случае с JSX, вам, вероятно, понадобится соответствующий плагин синтаксического анализа для их анализа. Это почти наверняка не имеет ничего общего с функциями со стрелкой, вы, вероятно, могли бы написать class Foo { x = 'x' } и получить ту же ошибку.