@kdcloudjs/eslint-plugin-kwc

Official ESLint rules for Kingdee Web Components (KWC).

Installation

$ npm install eslint @babel/core @babel/eslint-parser @kdcloudjs/eslint-plugin-kwc --save-dev

Usage

Starting with v3.0.0, @kdcloudjs/eslint-plugin-kwc only supports eslint@v9. Use @kdcloudjs/[email protected] for older versions of eslint.

Import @kdcloudjs/eslint-plugin-kwc and use it in the plugins section of your configuration as shown below. Then configure the desired rules in the rules sections. Some of the syntax used in Kingdee Web Components is not yet stage 4 (eg. class fields or decorators), and the out-of-the-box parser from ESLint doesn't support this syntax yet. In order to parse the KWC files properly, set the parser field to @babel/eslint-parser in the languageOptions section of the eslint config.

Example of eslint.config.js:

const eslintPluginKwc = require('@kdcloudjs/eslint-plugin-kwc');
const babelParser = require('@babel/eslint-parser');

module.exports = [
    {
        languageOptions: {
            parser: babelParser,
            parserOptions: {
                requireConfigFile: false,
                babelOptions: {
                    parserOpts: {
                        plugins: [
                            'classProperties',
                            ['decorators', { decoratorsBeforeExport: false }],
                        ],
                    },
                },
            },
        },
        plugins: {
            '@kwc/kwc': eslintPluginKwc,
        },
        rules: {
            '@kwc/kwc/no-deprecated': 'error',
            '@kwc/kwc/valid-api': 'error',
            '@kwc/kwc/no-document-query': 'error',
            '@kwc/kwc/ssr-no-unsupported-properties': 'error',
        },
    },
];

Usage with TypeScript

To enable working with TypeScript projects, install @babel/preset-typescript as a dependency add "typescript" to languageOptions.parserOptions.babelOptions.parserOpts.plugins in your eslint.config.js.

Example:

const eslintPluginKwc = require('@kdcloudjs/eslint-plugin-kwc');
const babelParser = require('@babel/eslint-parser');

module.exports = [
    {
        languageOptions: {
            parser: babelParser,
            parserOptions: {
                requireConfigFile: false,
                babelOptions: {
                    parserOpts: {
                        plugins: [
                            'classProperties',
                            ['decorators', { decoratorsBeforeExport: false }],
                            'typescript',
                        ],
                    },
                },
            },
        },
    },
];

For more details about configuration please refer to the dedicated section in the ESLint documentation: https://eslint.org/docs/user-guide/configuring

Processors

| Processor ID | Description | | ----------------------------------- | ------------------------------------------------- | | kwc/ssr | Lint only JavaScript files of SSR-able components |

Rules

KWC

| Rule ID | Description | Fixable | | -------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------ | ------- | | kwc/consistent-component-name | ensure component class name matches file name | 🔧 | | kwc/no-api-reassignments | prevent public property reassignments | | | kwc/no-deprecated | disallow usage of deprecated KWC APIs | | | kwc/no-document-query | disallow DOM query at the document level | | | kwc/no-attributes-during-construction | disallow setting attributes during construction | | | kwc/no-disallowed-kwc-imports | disallow importing unsupported APIs from the @kdcloudjs/kwc package | | | kwc/no-leading-uppercase-api-name | ensure public property doesn't start with an upper-case character | | | kwc/no-unexpected-wire-adapter-usages | enforce wire adapters to be used with wire decorator | | | kwc/no-unknown-wire-adapters | disallow usage of unknown wire adapters | | | kwc/valid-api | validate api decorator usage | | | kwc/valid-track | validate track decorator usage | | | kwc/valid-wire | validate wire decorator usage | | | kwc/valid-graphql-wire-adapter-callback-parameters | ensure graphql wire adapters are using 'errors' instead of 'error' | | | kwc/no-host-mutation-in-connected-callback | disallow the host element mutation in 'connectedCallback' | | | kwc/consistent-component-name | ensure component class name matches file name | 🔧 | | kwc/no-api-reassignments | prevent public property reassignments | | | kwc/no-deprecated | disallow usage of deprecated KWC APIs | | | kwc/no-document-query | disallow DOM query at the document level | | | kwc/no-attributes-during-construction | disallow setting attributes during construction | | | kwc/no-disallowed-kwc-imports | disallow importing unsupported APIs from the @kdcloudjs/kwc package | | | kwc/no-leading-uppercase-api-name | ensure public property doesn't start with an upper-case character | | | kwc/no-unexpected-wire-adapter-usages | enforce wire adapters to be used with wire decorator | | | kwc/no-unknown-wire-adapters | disallow usage of unknown wire adapters | | | kwc/valid-api | validate api decorator usage | | | kwc/valid-track | validate track decorator usage | | | kwc/valid-wire | validate wire decorator usage | | | kwc/ssr-no-restricted-browser-globals | disallow access to global browser APIs during SSR | | | kwc/ssr-no-unsupported-properties | disallow access of unsupported properties in SSR | | | kwc/ssr-no-node-env | disallow usage of process.env.NODE_ENV in SSR | | | kwc/ssr-no-disallowed-kwc-imports | restrict specific imports from the kwc package in SSR-able components | | | kwc/valid-graphql-wire-adapter-callback-parameters | ensure graphql wire adapters are using 'errors' instead of 'error' | | | kwc/ssr-no-host-mutation-in-connected-callback | disallow the host element mutation in 'connectedCallback' | | | kwc/ssr-no-static-imports-of-user-specific-scoped-modules | disallow static imports of user-specific scoped modules in SSR-able components | | | kwc/ssr-no-form-factor | disallow formFactor in SSR-able components | |

Best practices

| Rule ID | Description | Fixable | | ---------------------------------------------------------------------------------- | ---------------------------------------------------------- | ------- | | kwc/no-async-operation | restrict usage of async operations | | | kwc/no-dupe-class-members | disallow duplicate class members | | | kwc/no-inner-html | disallow usage of innerHTML | | | kwc/no-template-children | prevent accessing the immediate children of this.template | | | kwc/no-leaky-event-listeners | prevent event listeners from leaking memory | | | kwc/prefer-custom-event | suggest usage of CustomEvent over Event constructor | | | kwc/ssr-no-unsupported-node-api | disallow unsupported Node API calls in SSR-able components | |

Compat performance

Older browsers like IE11 run KWC in compatibility mode.

| Rule ID | Description | Fixable | | ---------------------------------------------------------- | ------------------------------------------- | ------- | | kwc/no-async-await | disallow usage of the async-await syntax | | | kwc/no-for-of | disallow usage of the for-of syntax | | | kwc/no-rest-parameter | disallow usage of the rest parameter syntax | |

Deprecated

| Rule ID | Replaced by | | ------------------------------------------------------------------ | ---------------------------------------------------------------------------------------------- | | kwc/no-dupe-class-members | no-dupe-class-members(base eslint rule) |