React: Parsing error in my functional component

Question

I installed babel-eslint and added "parser": "babel-eslint" but I'm still getting parsing error.

My package.json is:

{
  "name": "listassign",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "bootstrap": "^4.4.1",
    "react": "^16.12.0",
    "react-dom": "^16.12.0",
    "react-scripts": "3.2.0"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {

    "parser": "babel-eslint",
    "extends": "react-app"
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  },
  "devDependencies": {
    "babel-eslint": "^10.0.3"
  },
  "extends": [
    "standard",
    "standard-react"
]

}

I'm getting error in file:

function CharComponent(props){

    let displayList = [];

    function delete(e){
        let index = e.target.id;
        displayList.slice(index,1);
    }

Error is:Parsing error: Unexpected keyword 'delete'

I did this but no help.

`delete` is a keyword in JavaScript. You cannot use it as a function/variable name. — Pointy, Dec 02 '19 at 21:23
damnn @Pointy silly me !!!!!!! You helped me from wasting another hour to solve this, thanks! — ThatMan, Dec 02 '19 at 21:26
Reserved keyword as a property name ([dupe target](https://stackoverflow.com/questions/5306315/browser-support-for-using-a-reserved-word-as-a-property-name-in-javascript)) is unrelated to this. — Emile Bergeron, Dec 02 '19 at 21:31

score 4 · Accepted Answer · answered Dec 02 '19 at 21:23

You'll want to rename your function to something other than delete. Because delete is a keyword used by JavaScript, it is not a valid function name.

Try naming it something like

function deleteItem(e){
    let index = e.target.id;
    displayList.slice(index,1);
}

score 0 · Answer 2 · answered Dec 02 '19 at 21:25

0

You can not use delete as a keyword since it is a javascript keyword! Rename your function and it should work fine.

answered Dec 02 '19 at 21:25

Ckuessner

673
10
33

React: Parsing error in my functional component

2 Answers2