@orion.ui/orion-linter

Shared linting configurations and custom rules for Orion UI projects. This package provides a unified code style guide using ESLint (with custom TypeScript and Vue rules) and Stylelint.

Features

• ESLint:
  • TypeScript support
  • Vue.js 3 support
  • Stylistic rules
  • Custom rules for Orion architecture patterns
• Stylelint:
  • LESS support
  • BEM naming convention
  • Property ordering (clean order)
  • Unit filtering

Installation

Install the package and its peer dependencies:

npm install -D @orion.ui/orion-linter eslint stylelint typescript

Usage

ESLint Configuration

Create an eslint.config.mjs file in your project root:

import { getESLintConfig } from '@orion.ui/orion-linter';
export default await getESLintConfig();

OR

import { getESLintConfig } from '@orion.ui/orion-linter';

const orionConfig = await getESLintConfig();

export default [
  ...orionConfig,
  {
    // Your custom overrides here
    rules: {
      // ...
    }
  }
];

Stylelint Configuration

Create a stylelint.config.mjs file in your project root:

import { getStylelintConfig } from '@orion.ui/orion-linter';
export default await getStylelintConfig();

OR

import { getStylelintConfig } from '@orion.ui/orion-linter';

const orionConfig = await getStylelintConfig();

export default {
  ...orionConfig,
  rules: {
    ...orionConfig.rules,
    // Your custom overrides here
  }
};

Custom ESLint Rules

This package includes several custom rules designed to enforce architectural patterns within Orion projects. All rules are prefixed with orion-rules/.

| Rule Name | Description | |-----------|-------------| | async-suffix | Enforces async functions to have an 'Async' suffix. | | class-name-match-filename | Ensures class names match their filenames. | | default-props-are-static-readonly | Enforces default props to be static readonly. | | events-are-in-camel-case | Enforces event names to be in camelCase. | | force-dynamic-vue-imports-in-router | Requires dynamic imports for Vue components in router files. | | force-dynamic-vue-imports-in-services | Requires dynamic imports for Vue components in services. | | get-set-adjacent | Enforces getters and setters to be defined adjacently. | | get-set-one-liner | Enforces simple getters and setters to be on a single line. | | no-api-in-entity | Prevents API usage inside Entity classes. | | no-api-in-setup | Prevents API usage inside Vue setup functions (use services instead). | | no-entity-in-service | Prevents Entity usage inside Service classes. | | no-export-type-in-ts | Disallows exporting types in .ts files (prefer .d.ts files). | | popables-are-readonly | Enforces "popable" properties to be readonly. | | private-property-if-only-in-template | Ensures properties not used in the template are marked as private. | | state-are-private-readonly | Enforces state properties to be private and readonly. | | template-refs-are-readonly | Enforces template refs to be readonly. |

Requirements

• Node.js >= 18.12.0
• ESLint >= 9.0.0
• Stylelint >= 16.0.0
• TypeScript >= 5.0.0

License

MIT