Failed to load config "airbnb" to extend from - gitlab ci - gitlab-ci

Question

I tried to do and redo the Airbnb eslint installation in various ways, but I always get this build error inside GitLab-ci. It works in my local environment.
I created the project with the create-react-app, installed the dependencies separately so as not to overwrite the eslint version. But I've tried to install all dependencies together using npx install-peerdeps --dev eslint-config-airbnb and reinstalling the version of eslint created by creating react app.
I've also tried to set dependencies directly in package.json instead of creating a configuration file
My package.json:
{
"name": "assinatura",
"version": "0.1.0",
"private": true,
"dependencies": {
"#emotion/react": "^11.4.1",
"#emotion/styled": "^11.3.0",
"#mui/material": "^5.0.2",
"#react-pdf-viewer/core": "^2.9.1",
"#react-pdf-viewer/page-navigation": "^2.9.1",
"#react-pdf-viewer/zoom": "^2.9.1",
"axios": "^0.21.4",
"bootstrap": "^5.0.2",
"enzyme-to-json": "^3.6.2",
"pdfjs-dist": "2.6.347",
"progress-bar": "^0.1.1",
"prop-types": "^15.7.2",
"query-string": "^7.0.1",
"react": "^17.0.2",
"react-bootstrap": "^2.0.0-rc.0",
"react-dom": "^17.0.2",
"react-icons": "^4.2.0",
"react-meta-tags": "^1.0.1",
"react-router-dom": "^5.2.0",
"react-scripts": "4.0.3",
"react-signature-canvas": "^1.0.3",
"styled-components": "^5.3.1",
"web-vitals": "^1.0.1"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"test:coverage": "react-scripts test --coverage",
"eject": "react-scripts eject",
"postinstall": "node ./postconfig.js",
"eslint": "eslint .",
"eslint-fix": "eslint --fix .",
"build:staging": "sh -ac '. ./.env.staging; react-scripts build'"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"devDependencies": {
"enzyme": "^3.11.0",
"enzyme-adapter-react-16": "^1.15.6",
"eslint-config-airbnb": "^18.2.1",
"eslint-config-airbnb-base": "^14.2.1",
"eslint-config-prettier": "^8.3.0",
"eslint-plugin-import": "^2.22.1",
"eslint-plugin-jsx-a11y": "^6.4.1",
"eslint-plugin-prettier": "^4.0.0",
"prettier": "^2.4.1"
}
}
My .eslintrc:
{
"extends": [
"react-app",
"airbnb",
"plugin:jsx-a11y/recommended",
"prettier"
],
"plugins": [
"jsx-a11y",
"prettier"
],
"rules": {
"semi": 0,
"prettier/prettier": [
"error", {
"semi": false
}
]
}
}
and I put node_modules on .eslintignore
Has anyone ever experienced this?

Answer 1

I had a similar issue on a react app while deploying through GitHub and was code built.
npm install -g install-peerdeps
install-peerdeps --dev eslint-config-airbnb
install-peerdeps --dev eslint-config-airbnb-base
Will fix it for you too

Answer 2

In your .eslintrc or where your eslint config is,
look for the extends object and remove the "airbnb" from the array if it is not needed.
from ==> "extends": ["airbnb", "prettier", "plugin:react/jsx-runtime", "plugin:jsx-a11y/recommended", "plugin:react-hooks/recommended"],
to ==> "extends": ["prettier", "plugin:react/jsx-runtime", "plugin:jsx-a11y/recommended", "plugin:react-hooks/recommended"],
OR install the packages
npm install -g install-peerdeps install-peerdeps --dev eslint-config-airbnb install-peerdeps --dev eslint-config-airbnb-base

Answer 3

"eslintConfig": {
"extends": [
"react-app",
"react-app/test"
]
},

Answer 4

These Command-Line worked for me
rm -rf node_modules
sudo npm install eslint --save
sudo npm install eslint-config-airbnb-base --save
sudo npm install eslint-plugin-markdown --save
sudo npm install eslint-plugin-import --save
npm i
npx eslint --version