feature/pre commit

.husky/pre-commit

@@ -0,0 +1 @@
+npx lint-staged

.prettierignore

@@ -0,0 +1,5 @@
+.prettierignore
+.husky
+build
+dist
+node_modules

.prettierrc

@@ -0,0 +1 @@
+{}

changelog.md → CHANGELOG.md

@@ -6,6 +6,9 @@ All notable changes to this project will be documented here.
 
 Nothing yet.
 
+## [0.15.0] - Oct 3rd, 2024
+- Added [ESLint](https://eslint.org/) to enforce code quality and consistency
+
 ## [0.14.1] - Oct 2nd, 2024
 - Add a `brush-button-active` CSS class to the "brush" and "erase" buttons
 that visually depicts when the brush or erase tool is active

README.md

@@ -132,6 +132,15 @@ The repository ships with the built `dist/ulabel.js` file. This file is not to b
 npm run build
 ```
 
+### Linting and Formatting
+
+Linting and formatting are performed by [ESLint](https://eslint.org/)
+with the following plugins:
+- [typescript-eslint](https://typescript-eslint.io/)
+- [ESLint Stylistic](https://eslint.style/)
+
+Git hooks are run by [husky](https://typicode.github.io/husky/).
+
 ## Attribution
 
 The three demo images were downloaded from the [CityScapes dataset](https://www.cityscapes-dataset.com/). In particular, they are sampled from the first few frames of the `leftImg8bit_demoVideo`.

eslint.config.mjs

@@ -0,0 +1,53 @@
+import globals from "globals";
+import eslint from "@eslint/js";
+import stylistic from "@stylistic/eslint-plugin";
+import tseslint from "typescript-eslint";
+
+export default [
+    {
+        // Global ignores
+        // https://eslint.org/docs/latest/use/configure/configuration-files#configuration-objects
+        ignores: [
+            "node_modules",
+            "dist",
+            "build",
+            "demo.js",
+            "webpack.config.js",
+        ],
+    },
+    {
+        files: ["**/*.{js,mjs,cjs,ts}"],
+        languageOptions: {
+            globals: globals.browser,
+        },
+    },
+    stylistic.configs.customize(
+        {
+            braceStyle: "1tbs",
+            commaDangle: "always-multiline",
+            indent: 4,
+            quotes: "double",
+        },
+    ),
+    {
+        plugins: {
+            "@stylistic": stylistic,
+        },
+        rules: {
+            "@stylistic/array-element-newline": [
+                "error",
+                {
+                    consistent: true,
+                    multiline: true,
+                },
+            ],
+            "@stylistic/function-call-argument-newline": ["error", "consistent"],
+            "@stylistic/function-call-spacing": ["error", "never"],
+            "@stylistic/operator-linebreak": ["error", "after"],
+            "@stylistic/semi": ["error", "always"],
+        },
+
+    },
+    eslint.configs.recommended,
+    ...tseslint.configs.recommended,
+];