Lint-staged: Any possibility to use arbitrary node (gulp) tasks, not just CLI?

[akella]

I'm falling in love with lint-staged and the whole idea. It was nice so far with stylelint and eslint.
But i'm in need of running arbitrary checks on staged files.
Like, checking BEM methodology in HTML, or dist files sizes. I wrote couple of tasks with gulp, they are checking _all_ the files. But that is surely slow on big projects.

I tried this:

  scripts: {
  "lint": "gulp check"
  },
  "pre-commit": "lint",

But obviously the task did not receive list of staged files.

I've read all the issues, and saw there were some plans of integrating that into lint-staged (#8 ?). Or am i wrong? Or there are reasons it would not be implemented? (Or is there any help needed? I could possible do that.) Or is there any workaround to use lint-staged with gulp task for example (i suppose the problem is to give to that task the list of staged files to run on).
Sorry for so many questions, but i hope you get my idea anyway.

And thank you again for a great tool! :)

[okonet]

Hi Yuri :)

I think you're just missed this: https://github.com/okonet/lint-staged/blob/master/README.md#what-commands-are-supported

Your config doesn't include lint-staged config:

scripts: {
  "lint-staged": "lint-staged",
  "lint": "gulp check"
},
"lint-staged": {
  "*": "lint"
},
"pre-commit": "lint-staged"

This will run npm run lint for all staged files (*). So, effectively this will run:

npm run lint -- --path/to/staged/file ...

[akella]

i do have it, just skipped that part, sorry for that, tried to be as concise as possible.
I realized what i really needed was this: https://www.npmjs.com/package/yargs.
Lint-staged will run my task gulp check with staged files as parameter, and i will get those via yargs and just use it in my task.

May be it will be of some use for future gulpers.

Thank you for leading into the right path. Will try that tonight.

[akella]

Do you think some simple working gulp+lint-staged usage example may be useful in docs? i could do pull request when i succeed.

[okonet]

Yes, sure! Go ahead and create a docs PR!

[akella]

So for me it came down to this.
My package.json

"scripts": {
    "lint": "gulp lint",
    "lint-staged": "lint-staged"
  },
  "lint-staged": {
    "*.html": "lint",
    "*.js": "eslint"
  },
  "pre-commit": "lint-staged",

For the eslint the resulting task is ran the following way, and works ok:

/Users/akella/Desktop/git/PROJECT/node_modules/.bin/eslint -- /Users/akella/Desktop/git/PROJECT/gulp/tasks/lint.js

/Users/akella/Desktop/git/PROJECT/gulp/tasks/lint.js
  2:5  warning  'config' is assigned a value but never used  no-unused-vars
  3:5  warning  'eslint' is assigned a value but never used  no-unused-vars
  5:5  warning  'argv' is assigned a value but never used    no-unused-vars

✖ 3 problems (0 errors, 3 warnings)

For my custom html validating npm run lint task, the task is generated like this:

npm run lint -- /Users/akella/Desktop/git/PROJECT/build/02_Credits.html

[23:35:55] Using gulpfile ~/Desktop/git/PROJECT/gulpfile.js
[23:35:55] Task '/Users/akella/Desktop/git/PROJECT/build/02_Credits.html' is not in your gulpfile
[23:35:55] Please check the documentation for proper gulpfile formatting

But according to this and that for it to pass arguments it needs to be like this:

npm run lint -- -g /Users/akella/Desktop/git/PROJECT/build/02_Credits.html
npm run lint -- --grep=/Users/akella/Desktop/git/PROJECT/build/02_Credits.html

Both of those working for me, passing the arguments to final task.

I'm not that pro at all those things, so i might be missing something or be wrong at some level.

i tried to correct 7th line of findBin.js

const defaultArgs = ['--','-g'].concat(paths)

Just for testing purposes (i guess we should only add that in npm binary case), and it started working for me.
So if you confirm this all, i can make my tiny PR to fix npm binary arguments case for lint-staged.

[okonet]

It looks like an issue with gulp and how it handles arguments. I'm passing files as arguments according to the spec. https://docs.npmjs.com/cli/run-script says:

npm will pass all the arguments after the -- directly to your script

This is exactly what I'm doing.

Gulp, on the other hand, treats first argument as a command. I'm not very familiar with how to pass arguments to gulp TBH.

[akella]

Didnt find documentation about that yet =(
But testing all the options, i now know that gulp requires this:

// this works
gulp lint --env /Applications/
// this does not, tries to execute /Applications/ task
gulp lint -- /Applications/

Do you think it might be ok, to do a special case for npm scripts with indexOf('gulp') in findBin.js?

Anyhow i will continue to investigate this thing.

[okonet]

Why even use gulp for that? AFAIK the only reason for using gulp is to get proper files. But in case of linting with lint-staged you already have the needed list. Why not just run the linter then?

Re: special case — I would resist this as long this isn't a real issue for many users. One thing that could be done though is to introduce a way to change a way of how arguments are passed. This is less of a technical problem but more a UI one. I'm open for suggestions here.

[akella]

One obvious use case for me: i'm using nunjucks, which is .html files also, which would also be staged, and validated. So i have src/blabla.html – nunjucks and i have dist/blabla.html – real html). And i only need to validate html in dist actually.

[akella]

I think we may close this issue, as syntaxes for gulp arguments and npm tasks are quite different, and hard to integrate into current concise lint-staged notations =(.
I will use gulp hacks to get staged files exactly for this task, and lint-staged for some others, like eslint and prettify.
In case anyone will read this issue: https://www.npmjs.com/package/gulp-git-staged this one did the job for me this time.

[okonet]

@akella it's actaully a great feedback and I might consider adding templates for commands earlier. Something I was planning to do either way at some time point.

[okonet]

@akella see https://github.com/okonet/lint-staged/issues/138

[akella]

I think this is a great idea. Especially because it doesn't change anything for current users of lint-staged, but at the same time will allow new guys to use it in a lot of flexible ways.