Package Exports
- @pequity/eslint-config
- @pequity/eslint-config/prettier
Readme
@pequity/eslint-config
Custom ESLint and Prettier config with Vue.js support and sensible defaults
[!NOTE]
Starting from v1, this ESLint config uses the ESLint Flat config and is only compatible with ESLint v9+.
If you're looking for the previous version, checkout the README here.
Installation
pnpm i -D @pequity/eslint-config eslint prettierUsage
ESLint config
Add an eslint.config.js (or eslint.config.cjs if your project is CommonJS) that imports the config function:
import { config } from '@pequity/eslint-config';
export default [
...config({
env: ['browser'], // Make sure to add the appropriate global variables for your environment
}),
{
// Add custom rules here
},
];Customizing the config
The configuration comes with default settings that extend the neostandard config. You can further customize it by passing an object to the config function:
Config settings defaults:
| Option | Type | Description | Default |
|---|---|---|---|
| ts | boolean |
Enable TypeScript support | true |
| noJsx | boolean |
No jsx rules will be added | true |
| noStyle | boolean |
No style rules will be added | true |
| semi | boolean |
Use semicolons | true |
| vue | boolean |
Enable Vue.js support | true |
| vueVersion | 2 or 3 |
Specify the version of Vue.js | 3 |
| vitest | boolean |
Enable Vitest support | true |
Example:
config({
ts: false,
vue: true
vueVersion: 3,
vitest: false,
})Prettier config
Create a prettier.config.js file with the following content:
import prettierConfig from '@pequity/eslint-config/prettier';
export default prettierConfig;package.json scripts
Add the following ESLint commands to your .package-json for linting and autofixing:
{
"lint": "eslint \"**/*.{vue,ts,js}\"",
"lint-fix": "eslint --fix \"**/*.{vue,ts,js}\""
}VS Code settings
Ad the following settings to your VS Code project settings for autofix on save:
.vscode/settings.json
{
"editor.formatOnSave": true,
"editor.codeActionsOnSave": {
"source.fixAll.eslint": true
},
"[javascript]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[typescript]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
}
}Features
- Based on neostandard
- Prettier for code formatting
- Plugins
- eslint-plugin-html for linting inline scripts contained in HTML files
- eslint-plugin-vue for linting Vue.js files
- eslint-config-prettier for disabling all rules that conflict with Prettier
- eslint-plugin-prettier for using Prettier as a code formatter with
eslint --fix - eslint-plugin-simple-import-sort for auto-fixing imports order
- eslint-plugin-vitest for linting Vitest test files