Kuan Jia Hong

Tag: Next.js

  • 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;
    view raw .lintstagedrc.mjs hosted with ❤ by GitHub

    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.