Example without Lerna and global linter/formatter

[zirkelc]

Here's another option to use lint-staged at the project root, but still calling linters at package-level. This respects the linter and formatter configs/ignore files of each package.

const package = require('./package.json');
const { workspaces } = package; // or manually define workspaces as ['package-a', 'package-b']
const pattern = '**/*.{js,jsx,ts,tsx}';
const linter = 'node_modules/.bin/eslint --fix';

const rules = Object.fromEntries(workspaces.map(workspace => [`${workspace}/${pattern}`, `./${workspace}/${linter}`]))

module.exports = {
  // results into...
  // 'package-a/**/*.{js,jsx,ts,tsx}': 'package-a/node_modules/.bin/eslint --fix',
  // 'package-b/**/*.{js,jsx,ts,tsx}': 'package-b/node_modules/.bin/eslint --fix'
  ...rules
}

What do you think?

[sudo-suhas]

How does this compare to configuring it directly in the package.json? Saves having to configure repetitively for each new workspace, right? Adding a workspace folder should be a rare activity so not sure about the value provided by this approach.

[zirkelc]

I'm used to having dev dependencies like ESLint and Prettier (and their respective configs) at the package level instead of at the root level. However, some dependencies like Husky must be installed at project level. I wanted to keep lint-staged and its config next to Husky, but still call the package-level dependencies and respect their configs. Another option would be to cd into each package directory and the call the npm script for lint/format.

I think it's common to have multiple packages (or workspaces) in one project. Instead of specifiying them directly in the .js file, I added a workspace property to the project level package.json. But it's just convenience.