Next.js: config prettier & next lint with lint-staged

GitHub Discussion: https://github.com/lint-staged/lint-staged/discussions/1521

In the project root directory, create a .lintstagedrc.mjs file

import path from "path";
const buildEslintCommand = (filenames) =>
`next lint –fix –file ${filenames
.map((f) => path.relative(process.cwd(), f))
.join(" –file ")}`;
const lintStagedObject = {
"*.{js,jsx,ts,tsx}": [
buildEslintCommand,
"prettier –write –ignore-unknown",
],
};
export default lintStagedObject;

Background information:

I was struggling to come out with a way to combine Next.js next lint command and auto formatting code with prettier with pre-commit hook. After reading documentation and trial-and-error, the above configuration works.

Comments

Leave a comment