Design System ESLint

ESLint rules for linting and migrating projects that use the Swiss Post Design System.

Documentation

All rules offered by this package are documented individually in the rules documentation.

Installation

To install the package, run:

npm install @swisspost/design-system-eslint --save-dev

Linting Configuration

To use the Swiss Post Design System ESLint package, simply add the predefined to your ESLint configuration file:

// eslint.config.mjs
import post from '@swisspost/design-system-eslint';

export default [...post.configs.tsRecommended, ...post.configs.htmlRecommended];

To override the default configuration, you can extend the rules as follows:

// eslint.config.mjs
import post from '@swisspost/design-system-eslint';

export default [
  ...post.configs.tsRecommended,

  // apply html rules only to files in the src/safe directory
  ...post.configs.htmlRecommended.map(config => ({
    ...config,
    files: ['**/src/safe/*.html'],
  })),

  // override rules as needed
  {
    name: 'custom-config',
    rules: {
      '@swisspost/design-system/ts-rule-name': 'off',
      '@swisspost/design-system/html/html-rule-name': 'warn',
    },
  },
];

For more information, check the ESLint configuration documentation.

Running Linting

To run the linting, use the following command at the root of the project:

eslint

You can also use the --fix flag to automatically fix some issues:

eslint --fix

Inspecting Configuration

To get a better overview of the rules configured in your project, run:

eslint --inspect-config

Running Migrations

In addition to linting rules, the @swisspost/design-system-eslint package provides rules to help migrate from one version of the Design System to another. These migration rules do not need to be added to your ESLint configuration and can be run once using the following command at the root of the project:

eslint -c @swisspost/design-system-eslint/migrations.js --fix

Contribute

Considering supporting the Swiss Post Design System with your contribution? Whether you like to contribute new patterns, fix a bug, spotted a typo or have ideas for improvement - we'd love to hear from you. Learn how you can contribute to this project in the styles contribution guidelines and also take a look at the general contribution guidelines.

For any questions regarding the pattern library, you can reach out on the discussions page.

In order to keep our community open and inclusive, we expect you to read and follow our Code of Conduct.

License

Software contained in this repository is published by the Swiss Post Ltd. under the Apache 2.0 License.

© 2025 Swiss Post, Ltd.