pre-commit doesn't do anything !

[heshamelmasry77]

I am using the boilerplate on a big scale project and recently we are facing a problem of needing to run yarn lint before any commit we do. I looked and I found this pre-commit :

 "gitHooks": {
    "pre-commit": "cross-env PRE_COMMIT=true lint-staged"
  },

But it seems that it is doesn't run or nothing happens! , maybe someone explains to me how doesn't it works?

I thought about change and add it to be like this: "pre-commit": "yarn lint" but also nothing happens. I use WebStom and source tree. I am expecting when I stage my files I see the lint runs automatically.

this is my package json :

{
  "name": "",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "build": "rm -rf ../../public/dashboard/{js,css,img} && vue-cli-service build --no-clean --modern",
    "test:unit": "cross-env VUE_APP_TEST=unit vue-cli-service test:unit",
    "test:e2e": "cross-env VUE_APP_TEST=e2e vue-cli-service test:e2e --headless",
    "lint": "run-s lint:all:*",
    "build:ci": "yarn build --report",
    "dev": "vue-cli-service serve",
    "dev:e2e": "cross-env VUE_APP_TEST=e2e vue-cli-service test:e2e --mode=development",
    "docker": "docker-compose exec dev yarn",
    "lint:all:eslint": "yarn lint:eslint --ext .js,.vue .",
    "lint:all:markdownlint": "yarn lint:markdownlint \"docs/*.md\" \"*.md\"",
    "lint:all:prettier": "yarn lint:prettier \"**/*.{js,json,css,scss,vue,html,md}\"",
    "lint:all:stylelint": "yarn lint:stylelint \"src/**/*.{vue,scss}\"",
    "lint:eslint": "eslint --fix",
    "lint:markdownlint": "markdownlint",
    "lint:prettier": "prettier --write --loglevel warn",
    "lint:stylelint": "stylelint --fix",
    "new": "cross-env HYGEN_TMPLS=generators hygen new",
    "test": "run-s test:unit test:e2e",
    "test:ci": "run-s test:unit:ci test:e2e",
    "test:unit:ci": "yarn test:unit --coverage --ci",
    "test:unit:file": "yarn test:unit --bail --findRelatedTests",
    "test:unit:watch": "yarn test:unit --watch --notify --notifyMode change"
  },
  "dependencies": {
    "@fortawesome/fontawesome-svg-core": "1.2.26",
    "@fortawesome/free-solid-svg-icons": "5.12.0",
    "@fortawesome/vue-fontawesome": "0.1.9",
    "axios": "^0.19.2",
    "core-js": "3.6.4",
    "date-fns": "2.9.0",
    "filepond": "^4.4.12",
    "filepond-plugin-file-validate-size": "^2.2.1",
    "filepond-plugin-file-validate-type": "^1.2.4",
    "filepond-plugin-image-crop": "^2.0.3",
    "filepond-plugin-image-edit": "^1.4.0",
    "filepond-plugin-image-exif-orientation": "^1.0.6",
    "filepond-plugin-image-preview": "^4.3.1",
    "filepond-plugin-image-resize": "^2.0.4",
    "filepond-plugin-image-transform": "^3.4.2",
    "lodash": "4.17.15",
    "normalize.css": "8.0.1",
    "nprogress": "0.2.0",
    "register-service-worker": "^1.6.2",
    "v-video-embed": "^1.0.6",
    "vee-validate": "^3.3.8",
    "vue": "2.6.11",
    "vue-carousel": "^0.18.0",
    "vue-filepond": "^5.1.1",
    "vue-material-design-icons": "^4.4.0",
    "vue-meta": "2.3.2",
    "vue-router": "3.1.5",
    "vue-select": "^3.10.0",
    "vuex": "^3.1.2",
    "vuex-router-sync": "^5.0.0"
  },
  "devDependencies": {
    "@fullhuman/postcss-purgecss": "^2.0.6",
    "@vue/cli-plugin-babel": "4.1.2",
    "@vue/cli-plugin-e2e-cypress": "4.1.2",
    "@vue/cli-plugin-eslint": "4.1.2",
    "@vue/cli-plugin-pwa": "~4.2.0",
    "@vue/cli-plugin-unit-jest": "4.1.2",
    "@vue/cli-plugin-vuex": "~4.2.0",
    "@vue/cli-service": "4.1.2",
    "@vue/eslint-config-prettier": "6.0.x",
    "@vue/eslint-config-standard": "5.1.x",
    "@vue/test-utils": "1.0.0-beta.31",
    "babel-core": "7.0.0-bridge.0",
    "babel-eslint": "10.0.x",
    "cross-env": "7.0.x",
    "cssnano": "^4.1.10",
    "dotenv": "^8.2.0",
    "eslint": "6.8.x",
    "eslint-plugin-import": "2.20.x",
    "eslint-plugin-node": "11.0.x",
    "eslint-plugin-promise": "4.2.x",
    "eslint-plugin-standard": "4.0.x",
    "eslint-plugin-vue": "6.1.x",
    "express": "4.17.x",
    "hygen": "4.0.x",
    "imagemin-lint-staged": "0.4.x",
    "laravel-vue-pagination": "^2.3.1",
    "lint-staged": "10.0.x",
    "markdownlint-cli": "0.21.x",
    "miragejs": "^0.1.35",
    "npm-run-all": "4.1.x",
    "null-loader": "^3.0.0",
    "portal-vue": "^2.1.7",
    "postcss-import": "^12.0.1",
    "postcss-loader": "^3.0.0",
    "sass": "1.25.x",
    "sass-loader": "8.0.x",
    "stylelint": "13.0.x",
    "stylelint-config-css-modules": "2.2.x",
    "stylelint-config-prettier": "8.0.x",
    "stylelint-config-recess-order": "2.0.x",
    "stylelint-config-standard": "19.0.x",
    "stylelint-scss": "3.14.x",
    "tailwindcss": "^1.6.2",
    "vue-chartjs": "^3.5.0",
    "vue-client-only": "^2.0.0",
    "vue-content-placeholders": "^0.2.1",
    "vue-i18n": "^8.15.3",
    "vue-lazyload": "^1.3.3",
    "vue-template-compiler": "2.6.11"
  },
  "engines": {
    "node": ">=10.13.3",
    "yarn": ">=1.0.0"
  },
  "gitHooks": {
    "pre-commit": "cross-env PRE_COMMIT=true lint-staged"
  },
  "resolutions": {
    "@vue/cli-plugin-unit-jest/jest": "25.1.x",
    "@vue/cli-plugin-unit-jest/babel-jest": "25.1.x"
  }
}

[MysticEarth]

It's a pre-commit hook, which will be executed before the actual commit. When you do a git commit, then the hook is called and will in this case run lint-staged. If the hooks fails (due to linting errors for example) your files will not be committed.

lint-staged is configured with lint-staged.config.js. Can you check that file, perhaps the files you changed aren't included in the config?

[heshamelmasry77]

lint-staged.config.js

Hey, Thank you for coming back to me, Actually, I figured out why it is not working, the reason is that I have my VUEJS project in a subfolder in a big Laravel project. I honestly don't have a solution for it, I tried to move

"gitHooks": {
    "pre-commit": "cross-env PRE_COMMIT=true lint-staged"
  }, 

to the main project Package.json but still it didn't work.