@garavest/eslint-config
v2.1.1
Published
A highly opinionated ESLint Config used by Garavest LLC for internal and public projects.
Downloads
2
Maintainers
Readme
@garavest/eslint-config
This package provides Garavest's eslint.config.js
as an extendable, shareable
config.
Usage
To use our config, you must use the new ESLint Flat Config, otherwise our config will result in errors. Our config is designed around using TypeScript; however, our config will also check your JavaScript files. Assuming you are using a Flat Config, using our config is very simple.
Standalone Usage
If you don't intend to extend (or modify) our config, import the config object, and then use the default config as shown below.
import { garavest } from "@garavest/eslint-config";
/** @type {import("eslint").Linter.FlatConfig[]} */
export default garavest.default;
Extended Usage
If you do wish to extend our config, you will need to export an array with our config spread in it as shown below:
import { garavest } from "@garavest/eslint-config";
/** @type {import("eslint").Linter.FlatConfig[]} */
export default [
...garavest.default
// Your other configuration can go here
];
Alternatively, if you wish to take only parts of our config, you can spread parts of our config into your own. In the example below, we'll say you are only using Javascript.
import { garavest } from "@garavest/eslint-config";
/** @type {import("eslint").Linter.FlatConfig[]} */
export default [garavest.global, garavest.prettier, garavest.javascript];
Framework Support
You can bake your own framework support in or, optionally, we provide a config for Svelte that can be used with or without SvelteKit. To enable this, you can simply use the following snippet for the default config:
NOTE
The prettier plugin does NOT work with svelte because it checks for the parser which is not supported in flat configs. Therefore, you cannot use the default config with svelte.
import { garavest } from "@garavest/eslint-config";
/** @type {import("eslint").Linter.FlatConfig[]} */
export default [
garavest.global,
garavest.import,
garavest.javascript,
garavest.typescript,
garavest.stylistic,
garavest.svelte
];
API
TL;DR
Our package exports the following:
export const garavest = {
default: defaultConfig,
global: globalConfig,
import: importConfig,
javascript: javascriptConfig,
prettier: prettierConfig,
stylistic: stylisticConfig,
svelte: svelteConfig,
typescript: typescriptConfig
};
The API of the config is pretty simple. The config exports a single object
called garavest
that contains all the flat configs. Each config is documented
below.
IMPORTANT NOTE
Nowhere in our config do we define a
sourceType
(except foreslint-plugin-import
); however, we ALWAYS set theecmaVersion
to latest. We do this so that you can use whateverecmaFeatures
you want (that ESLint supports), but you are not locked into using modules or commonjs. SincesourceType
is never defined, ESLint will default to what you specify in yourpackage.json
.
default
The default
config is our "recommended" config with Javascript, Prettier,
Typescript, Import, and Stylistic support enabled by default. The default
config is functionally equivalent to the code snippet below.
import { garavest } from "@garavest/eslint-config";
/** @type {import("eslint").Linter.FlatConfig[]} */
export default [
garavest.global,
garavest.prettier,
garavest.import,
garavest.javascript,
garavest.typescript,
garavest.stylistic
];
global
The global
config just sets some useful global options for ESLint. It can
safely be omitted, if you prefer. The options set are:
- ignore all files in the
globalIgnores
array - set
ecmaVersion
to"latest"
- set
reportUnusedDisableDirectives
totrue
NOTE
In version 3, the noInlineConfig
option will also be turned on, so if you
encounter bugs, let us know.
javascript
The javascript
config contains all of the Javascript rules we use.
prettier
The prettier
config basically just enables the Prettier plugin and enables
Prettier errors.
svelte
The svelte
config contains all of the Svelte/SvelteKit rules we use.
typescript
The typescript
config contains all of the Typescript rules we use.
stylistic
The stylistic
config contains our stylistic rules.