Next.js: Linting

[sedubois]

Hi and thanks for this exciting project! 👍

Wouldn't it be great to have linting out of the box with now, as it is such an ubiquitous need?

I see that now uses the standard config internally, but I have a preference for airbnb which is roughly twice more popular and a.o. enforces trailing commas (comma dangles) for easier diffs and code reordering.

[luisrudge]

Not sure it should support OOTB, because people will have their own linting preferences.. It's super easy to add it though. I have a simple boilerplate with airbnb configs: https://github.com/luisrudge/next.js-boilerplate

[sedubois]

Not a big deal of course, but same as for other things next provides, I thought it could provide sensible defaults while allowing to configure if needed. According to the NPM website, hundreds of thousands of people seem to trust the airbnb defaults, so why burden them with that...

It would be a bit sad that, just to add linting, a project which otherwise has a single next dep would suddenly need 7 deps + 15 extra config LOCs, not to mention the need to maintain it.

[Florian-R]

Could be great if it was just possible to respect eslintConfig in package.json, eventually falling back to standart.

This way, one can switch to something like airbnb easily, but there's also some sensible defaults.

[luisrudge]

I think this is too much of a personal decision to delegate to next.js.

[sedubois]

IMHO, linting ought to be an opt-out feature, not opt-in. In 2016, linting JS web projects is the norm, not the exception. And there is a sensible default config, namely airbnb (or if for some reason the authors have something against that, at least standard with easy way to override).

[eezing]

I agree that linting is too much of a personal decision to include here.

[KATT]

+1 airbnb linting with opt-out possibility

[foxhound87]

+1 airbnb linting with opt-out possibility

[dzcpy]

+1 airbnb linting with opt-out possibility

[arunoda]

We use standard for the next's own source code linting.
But you could use anything for your app.

I hope we could close this issue.

[sakulstra]

Sry for digging this out again :)
I basically wanted to figure out what code style next.js recommends when i found this ticket.

I love what create-react-app did to os react applications:
It basically made people sensible for linting and you can see this in numerous applications here on github. I think that next.js shouldn't have an opinion about what kind of linting you use - but it should at least tell you that linting is totally possible and easy to archive.

A short section in the readme right after the installation part would be sufficient. I'd be happy to make a pr if there were chances i got accepted.

Linting

We highly recommend the use of a linter like standard or eslint to maintain a consistent code style throughout your application.

Adding eslint airbnb

You have to install the required packages

npm install bla-sry-was-to-lazy-to-dig.them-up

and extend your package.json with a linting command

"scripts": {
    "lint": "npm run lint"
}

Adding standard.js

You have to install the required packages

npm install --save-dev standard

and extend your package.json with a linting command

"scripts": {
    "lint": "standard"
}

[timneutkens]

I guess we can accept an example in the examples directory for them 🤔 Something like: with-linting-eslint with-linting-xo with-linting-standard-js cc @impronunciable

[sakulstra]

hmm... i'm not a fan of that idea :)
linting is no :rocket: science - so you shouldn't have to look for it to find it. For standard it's basically really only the two lines you have to type and for eslint it's not more complicated (more packages though).

The part in the readme is imo important as almost everyone will read this and should think: oh yes, good catch i should lint - i'll do it right away.