Scratch ESLint config

eslint-config-scratch defines eslint and prettier rules for Scratch Javascript and TypeScript projects.
Generally speaking, this configuration uses prettier for code style and formatting and eslint to flag potential
mistakes and encourage code that's easier to read and understand.

Quick Start

Install the config along with its peer dependencies, eslint and prettier:

``bash
npm install -D eslint-config-scratch eslint@^9 prettier@^3
`

Add eslint.config.mjs to your project root.

For a TypeScript project, you can add languageOptions to enable type checking. For example, if your tsconfig.json
covers files under src/, and you want to ignore dist/ and node_modules/, your configuration might look like this:

`js
// myProjectRoot/eslint.config.mjs
import { eslintConfigScratch } from 'eslint-config-scratch'
import { globalIgnores } from 'eslint/config'

export default eslintConfigScratch.defineConfig(
eslintConfigScratch.recommended,
{
files: ['src/**'],
languageOptions: {
parserOptions: {
projectService: true,
tsconfigRootDir: import.meta.dirname,
},
},
},
globalIgnores(['dist/', 'node_modules/']),
)
`

For a JavaScript project, it might look like this:

`js
// myProjectRoot/eslint.config.mjs
import { eslintConfigScratch } from 'eslint-config-scratch'

export default eslintConfigScratch.recommended
`

The function eslintConfigScratch.defineConfig is a re-export of the defineConfig function from @eslint/config,
and helps with merging and extending configurations.

Add prettier.config.mjs to your project root as well:

`js
// myProjectRoot/prettier.config.mjs
import { prettierConfigScratch } from 'eslint-config-scratch'

export default prettierConfigScratch.recommended
`

Finally, add scripts like these to your package.json:

`json
"scripts": {
"format": "prettier --write . && eslint --fix",
"lint": "eslint && prettier --check .",
}
`

Basic Configuration

The function eslintConfigScratch.defineConfig is a re-export of the defineConfig function from @eslint/config,
and helps with merging and extending configurations. Full documentation is available here:
.

The config function can be used to add or override rules, plugins, and other configuration options. For example:

`js
// myProjectRoot/eslint.config.mjs
import { eslintConfigScratch } from 'eslint-config-scratch'
import { globalIgnores } from 'eslint/config'
import globals from 'globals'

export default eslintConfigScratch.defineConfig(
eslintConfigScratch.recommended,
{
files: ['src/**'],
languageOptions: {
globals: {
...globals.node,
MY_CUSTOM_GLOBAL: 'readonly',
},
parserOptions: {
projectService: true,
tsconfigRootDir: import.meta.dirname,
},
},
},
// Ignore all files in the dist and node_modules directories
globalIgnores(['dist/', 'node_modules/']),
)
`

Granular Configuration

The eslintConfigScratch object contains granular configurations as well:

- recommendedTypeFree: A configuration suitable for contexts without type information, such as a JavaScript project.
- recommendedTypeChecked: A configuration suitable for contexts with type information, such as a TypeScript project.
You must provide extra configuration to parserOptions to enable type checking. See here:


The recommended configuration is a combination of the two, and should be suitable for most projects. Features
requiring type information are enabled for TypeScript files, and features that don't require type information are
enabled for all files.

Legacy Styles

Scratch used very different styling rules in eslint-config-scratch@^9 and below. If you need to use those rules, you
can use these legacy configurations:

- eslintConfigScratch.legacy.base: Legacy base configuration, not configured for any particular environment
- eslintConfigScratch.legacy.es6: Legacy rules for targeting Scratch's supported web browsers
- eslintConfigScratch.legacy.node: Legacy rules for targeting Node.js
- eslintConfigScratch.legacy.react: Legacy rules for targeting Scratch's supported web browsers with React

New projects should not use these rule sets. They may disappear in the future. Scratch did not use Prettier at this
time, so there is no legacy Prettier configuration.

Legacy Scratch projects usually extend more than one of these at a time, and potentially a different set per
subdirectory. To do that in this new flat configuration format:

`js
// scratch-gui/eslint.config.mjs
import { eslintConfigScratch } from 'eslint-config-scratch'
import { globalIgnores } from 'eslint/config'
import globals from 'globals'

export default eslintConfigScratch.defineConfig(
eslintConfigScratch.legacy.base,
eslintConfigScratch.legacy.es6,
{
files: ['src//.js', 'src//.jsx'],
extends: [eslintConfigScratch.legacy.react],
languageOptions: {
globals: globals.browser,
},
rules: {
// ...customized rules for src/...
},
// ...other settings for src/...
},
// ...settings for test/, etc...
globalIgnores(['dist/', 'node_modules/']),
)
`

Committing

This project uses semantic release
to ensure version bumps follow semver so that projects using the config don't
break unexpectedly.

In order to automatically determine the type of version bump necessary, semantic
release expects commit messages to be formatted following
conventional-changelog.

`raw
():