@knime/eslint-config

This repository contains an ESLint ruleset for typical KNIME frontend projects. Rules cover simple JavaScript/TypeScript setups as well as Vue2/Vue3 and Nuxt projects. A few overrides to cover common test scenarios with Jest and Vitest are also present.

Also it contains some configs for Stylelint, lintstaged and a Git hook to format commit messages.

Formatting is supposed to be handled via Prettier.

Development

Prerequisites

• Install Node.js, see version in package.json.

Newer versions may also work, but have not been tested.

Installation

To install the @knime/eslint-config package, you can use npm:

npm install @knime/eslint-config

Linting

The different ESLint profiles contained herein can also be linted by running

npm run lint

Running security audit

npm provides a check against known security issues of used dependencies. Run it by calling

npm audit

Using the ESLint profiles in your project

The ESLint profiles in most cases come with pre-packaged ESLint plugins and plugin configurations. However there is a long standing issue with ESLint which makes it a cumbersome setup. To remedy this shortcoming you can use a patch which is pulled in as a transitive dependency already. The following code block should give an understanding of a commonly used setup in your .eslintrc.js file:

// This is a workaround for https://github.com/eslint/eslint/issues/3458
require("@rushstack/eslint-patch/modern-module-resolution");

module.exports = {
  extends: ["@knime/eslint-config/vue3"],
  globals: {
    consola: true,
  },
  // [...]
};

Using Stylelint in your project

The following code block should give an understanding of a commonly used setup in your .stylelintrc file:

module.exports = {
  extends: ["@knime/eslint-config/stylelint/vue"],
};

See stylelint folder for available configs.

Requirements

Projects still need to specify the following devDependency in their respective package.json files, but none of the required additional plugins:

• ESlint
• Stylelint
• Prettier

Using Git hooks in your project

The package supplies the tools to running a couple of commit hooks:

Linting and formatting staged changes

Include the following in a pre-commit hook to lint and format the changes in your stage zone (via lintstaged).

#!/usr/bin/env bash
npx lint-staged

Additionaly, use the lint-staged.config.mjs file to configure lint-staged, i.e. create a lint-staged.config.mjs file in the root folder containing

import config from "@knime/eslint-config/lint-staged.config.mjs";
export default config;

Format commit message

Use a prepare-commit-msg hook to format your commit message to conform with the required format by KNIME:

#!/usr/bin/env bash
npm exec knime-eslint-config-prepare-commit-msg "$@"

In case the npm project isn't in the root folder, please do:

#!/usr/bin/env bash
<path-to-npm-project>/node_modules/.bin/knime-eslint-config-prepare-commit-msg "$@"

Refer to scripts/README.md for more information.