Why do I get an "Unexpected character '@'" parsing error when I run ESLint?

Question

I'm getting this parsing error (i.e., error Unexpected character '@' ParseError) returned when running eslint --cache --fix. I'm not sure why I'm seeing this error though, since I don't have an '@' anywhere near that line that's being flagged as problematic. The following is a snippet of my code where the issue is happening:

const getCustomerInformation = async (id, role) => {
    return await gql
        .query({
            query: GET_CUSTOMER_DATA,
            variables: {
                id
            }
        })
        .then((res) => {
            response[role] = res
        })
}

GET_CUSTOMER_DATA is being imported from another file and is as follows:

export const GET_CUSTOMER_DATA = gql`
    query getCustomerInformation($id: String!) {
        OSDTGetCustomerInformation(id: $id) {
            ... on CustomerSuccess {
                id
                fullName
            }
            ... on CustomerError {
                message
            }
        }
    }
`

The line that's being flagged as problematic is query: GET_CUSTOMER_DATA at character 42 in the 1st code block. As mentioned earlier though, I don't see an instance of '@' being used, so I'm not sure why there's a linting issue. I'd really appreciate it if someone could help me understand what could be the issue here.

FWIW, I'm using ESLint v7.31.0.

Answer 1

It turns out that the pre-commit linter was recognizing that I hadn't added any documentation for getCustomerInformation(). So, the linter attempted to solve this by adding a comment with getCustomerInformation()'s parameters (i.e., id & role) that included '@'. However, the linter wasn't adding them in the right place — which is what was throwing the parsing error. So, I had to manually add documentation. I added the following above where getCustomerInformation() is being defined:

/**
* @param {string} id
* @param {string} role
*/