Install Master CSS ESLint in Angular

Guide to installing Master CSS ESLint in your Angular project.

Installation

Install the plugin and parser into your project via package managers.

npm install -D @master/eslint-config-css@rc @angular-eslint/template-parser @typescript-eslint/parser eslint

Set up ESLint config

Import and add the Master CSS ESLint Configuration css to eslint.config.js.

Use @angular-eslint/template-parser to parse .html files.
Use @typescript-eslint/parser to parse .tsx files.

import htmlParser from "@angular-eslint/template-parser"
import tsParser from '@typescript-eslint/parser'
import css from '@master/eslint-config-css'
 
export default [
    {
        files: ['**/*.html'],
        languageOptions: { parser: htmlParser }
    },
    {
        files: ['**/*.ts'],
        languageOptions: { parser: tsParser }
    },
    css
]

Start linting your code

npx eslint

Not working in Visual Studio Code? Next, set up the VSCode ESLint.