chore: replace eslint & prettier with oxc

.codesandbox/tasks.json

@@ -19,11 +19,6 @@
       "command": "yarn fix",
       "runAtStart": false
     },
-    "prettier": {
-      "name": "Prettify",
-      "command": "yarn prettier",
-      "runAtStart": false
-    },
     "start": {
       "name": "Start Excalidraw",
       "command": "yarn start",

.env.development

@@ -37,9 +37,6 @@ VITE_APP_DEBUG_ENABLE_TEXT_CONTAINER_BOUNDING_BOX=
 # Set this flag to false if you want to open the overlay by default
 VITE_APP_COLLAPSE_OVERLAY=true
 
-# Set this flag to false to disable eslint
-VITE_APP_ENABLE_ESLINT=true
-
 # Enable PWA in dev server
 VITE_APP_ENABLE_PWA=false
 

.env.production

@@ -29,6 +29,3 @@ PQIDAQAB'
 # Set the below flags explicitly to false in production mode since vite loads and merges .env.local vars when  running the build command
 VITE_APP_DEBUG_ENABLE_TEXT_CONTAINER_BOUNDING_BOX=false
 VITE_APP_COLLAPSE_OVERLAY=false
-# Enable eslint in dev server
-VITE_APP_ENABLE_ESLINT=false
-

.eslintignore

@@ -1,11 +0,0 @@
-node_modules/
-build/
-package-lock.json
-.vscode/
-firebase/
-dist/
-public/workbox
-packages/excalidraw/types
-examples/**/public
-dev-dist
-coverage

.eslintrc.json

@@ -1,43 +0,0 @@
-{
-  "extends": ["@excalidraw/eslint-config", "react-app"],
-  "rules": {
-    "import/order": [
-      "warn",
-      {
-        "groups": ["builtin", "external", "internal", "parent", "sibling", "index", "object", "type"],
-        "pathGroups": [
-          {
-            "pattern": "@excalidraw/**",
-            "group": "external",
-            "position": "after"
-          }
-        ],
-        "newlines-between": "always-and-inside-groups",
-        "warnOnUnassignedImports": true
-      }
-    ],
-    "import/no-anonymous-default-export": "off",
-    "no-restricted-globals": "off",
-    "@typescript-eslint/consistent-type-imports": [
-      "error",
-      {
-        "prefer": "type-imports",
-        "disallowTypeAnnotations": false,
-        "fixStyle": "separate-type-imports"
-      }
-    ],
-    "no-restricted-imports": [
-      "error",
-      {
-        "name": "jotai",
-        "message": "Do not import from \"jotai\" directly. Use our app-specific modules (\"editor-jotai\" or \"app-jotai\")."
-      }
-    ],
-    "react/jsx-no-target-blank": [
-      "error",
-      {
-        "allowReferrer": true
-      }
-    ]
-  }
-}

.gitignore

@@ -8,7 +8,9 @@
 .history
 .idea
 .vercel
-.vscode
+.vscode/*
+!.vscode/extensions.json
+!.vscode/settings.recommended.json
 .yarn
 *.log
 *.tgz

.lintstagedrc.js

@@ -1,14 +1,4 @@
-const { CLIEngine } = require("eslint");
-
-// see https://github.com/okonet/lint-staged#how-can-i-ignore-files-from-eslintignore-
-// for explanation
-const cli = new CLIEngine({});
-
 module.exports = {
-  "*.{js,ts,tsx}": files => {
-    return (
-      "eslint --max-warnings=0 --fix " + files.filter(file => !cli.isPathIgnored(file)).join(" ")
-    );
-  },
-  "*.{css,scss,json,md,html,yml}": ["prettier --write"],
+  "*.{js,ts,tsx}": ["oxlint --fix", "oxfmt --write"],
+  "*.{css,scss,json,md,html,yml}": ["oxfmt --write"],
 };

.oxfmtrc.json

@@ -0,0 +1,5 @@
+{
+  "printWidth": 80,
+  "proseWrap": "never",
+  "trailingComma": "all"
+}

.oxlintrc.json

@@ -0,0 +1,112 @@
+{
+  "$schema": "https://raw.githubusercontent.com/oxc-project/oxc/main/npm/oxlint/configuration_schema.json",
+  "plugins": ["typescript", "react", "jsx-a11y", "import"],
+  "rules": {
+    "no-unused-vars": [
+      "warn",
+      {
+        "ignoreRestSiblings": true
+      }
+    ],
+    "curly": "warn",
+    "no-console": [
+      "warn",
+      {
+        "allow": ["info", "warn", "error"]
+      }
+    ],
+    "no-else-return": "warn",
+    "no-lonely-if": "warn",
+    "no-unneeded-ternary": "warn",
+    "no-unused-expressions": "warn",
+    "no-useless-return": "warn",
+    "no-var": "warn",
+    "one-var": "warn",
+    "prefer-arrow-callback": "warn",
+    "prefer-const": "warn",
+    "prefer-template": "warn",
+    "typescript/consistent-type-imports": [
+      "error",
+      {
+        "disallowTypeAnnotations": false
+      }
+    ],
+    "typescript/no-restricted-imports": [
+      "error",
+      {
+        "patterns": [
+          {
+            "group": [
+              "../../excalidraw",
+              "../../../packages/excalidraw",
+              "@excalidraw/excalidraw"
+            ],
+            "message": "Do not import from '@excalidraw/excalidraw' package anything but types, as this package must be independent.",
+            "allowTypeImports": true
+          }
+        ]
+      }
+    ],
+    "eslint/no-restricted-imports": [
+      "error",
+      {
+        "paths": [
+          {
+            "name": "jotai",
+            "message": "Do not import from \"jotai\" directly. Use our app-specific modules (\"editor-jotai\" or \"app-jotai\")."
+          }
+        ]
+      }
+    ],
+    "react/jsx-no-target-blank": [
+      "error",
+      {
+        "allowReferrer": true
+      }
+    ],
+    "jsx-a11y/no-autofocus": "off",
+    "eslint/no-async-promise-executor": "off",
+    "eslint-plugin-jsx-a11y/click-events-have-key-events": "off",
+    "eslint-plugin-jsx-a11y/label-has-associated-control": "off"
+  },
+  "ignorePatterns": [
+    "node_modules/",
+    "build/",
+    "dist/",
+    ".vscode/",
+    "firebase/",
+    "public/workbox",
+    "packages/excalidraw/types",
+    "examples/**/public",
+    "dev-dist",
+    "coverage"
+  ],
+  "overrides": [
+    {
+      "files": [
+        "packages/common/src/**/*.ts",
+        "packages/common/src/**/*.tsx",
+        "packages/element/src/**/*.ts",
+        "packages/element/src/**/*.tsx"
+      ],
+      "rules": {
+        "typescript/no-restricted-imports": [
+          "error",
+          {
+            "patterns": [
+              {
+                "group": [
+                  "../../excalidraw",
+                  "../../../packages/excalidraw",
+                  "@excalidraw/excalidraw"
+                ],
+                "message": "Do not import from '@excalidraw/excalidraw' package anything but types, as this package must be independent.",
+                "allowTypeImports": true
+              }
+            ]
+          }
+        ]
+      }
+    }
+  ]
+}

.vscode/extensions.json

@@ -0,0 +1,3 @@
+{
+  "recommendations": ["oxc.oxc-vscode"]
+}

.vscode/settings.recommended.json

@@ -0,0 +1,22 @@
+{
+  "oxc.enable": true,
+  "editor.formatOnSave": true,
+  "[javascript]": {
+    "editor.defaultFormatter": "oxc.oxc-vscode"
+  },
+  "[typescript]": {
+    "editor.defaultFormatter": "oxc.oxc-vscode"
+  },
+  "[javascriptreact]": {
+    "editor.defaultFormatter": "oxc.oxc-vscode"
+  },
+  "[typescriptreact]": {
+    "editor.defaultFormatter": "oxc.oxc-vscode"
+  },
+  "[json]": {
+    "editor.defaultFormatter": "oxc.oxc-vscode"
+  },
+  "[jsonc]": {
+    "editor.defaultFormatter": "oxc.oxc-vscode"
+  }
+}

examples/with-script-in-browser/package.json

@@ -3,14 +3,14 @@
   "version": "1.0.0",
   "private": true,
   "dependencies": {
+    "@excalidraw/excalidraw": "0.18.0",
+    "browser-fs-access": "0.29.1",
     "react": "19.0.0",
-    "react-dom": "19.0.0",
-    "@excalidraw/excalidraw": "*",
-    "browser-fs-access": "0.29.1"
+    "react-dom": "19.0.0"
   },
   "devDependencies": {
-    "vite": "5.0.12",
-    "typescript": "^5"
+    "typescript": "^5",
+    "vite": "5.0.12"
   },
   "scripts": {
     "start": "vite",

excalidraw-app/vite-env.d.ts

@@ -26,9 +26,6 @@ interface ImportMetaEnv {
   // Set this flag to false if you want to open the overlay by default
   VITE_APP_COLLAPSE_OVERLAY: string;
 
-  // Enable eslint in dev server
-  VITE_APP_ENABLE_ESLINT: string;
-
   // Enable PWA in dev server
   VITE_APP_ENABLE_PWA: string;
 

excalidraw-app/vite.config.mts

@@ -5,6 +5,7 @@ import svgrPlugin from "vite-plugin-svgr";
 import { ViteEjsPlugin } from "vite-plugin-ejs";
 import { VitePWA } from "vite-plugin-pwa";
 import checker from "vite-plugin-checker";
+import oxlint from "vite-plugin-oxlint";
 import { createHtmlPlugin } from "vite-plugin-html";
 import Sitemap from "vite-plugin-sitemap";
 import { woff2BrowserPlugin } from "../scripts/woff2/woff2-vite-plugins";
@@ -125,15 +126,16 @@ export default defineConfig(({ mode }) => {
       react(),
       checker({
         typescript: true,
-        eslint:
-          envVars.VITE_APP_ENABLE_ESLINT === "false"
-            ? undefined
-            : { lintCommand: 'eslint "./**/*.{js,ts,tsx}"' },
         overlay: {
           initialIsOpen: envVars.VITE_APP_COLLAPSE_OVERLAY === "false",
           badgeStyle: "margin-bottom: 4rem; margin-left: 1rem",
         },
       }),
+      oxlint({
+        configFile: path.resolve(__dirname, "../.oxlintrc.json"),
+        path: path.resolve(__dirname, ".."),
+        oxlintPath: path.resolve(__dirname, "../node_modules/.bin/oxlint"),
+      }),
       svgrPlugin(),
       ViteEjsPlugin(),
       VitePWA({

package.json

@@ -4,13 +4,10 @@
   "packageManager": "[email protected]",
   "workspaces": [
     "excalidraw-app",
-    "packages/*",
-    "examples/*"
+    "packages/*"
   ],
   "devDependencies": {
     "@babel/preset-env": "7.26.9",
-    "@excalidraw/eslint-config": "1.0.3",
-    "@excalidraw/prettier-config": "1.0.2",
     "@types/chai": "4.3.0",
     "@types/jest": "27.4.0",
     "@types/lodash.throttle": "4.1.7",
@@ -22,22 +19,20 @@
     "@vitest/ui": "2.0.5",
     "chai": "4.3.6",
     "dotenv": "16.0.1",
-    "eslint-config-prettier": "8.5.0",
-    "eslint-config-react-app": "7.0.1",
-    "eslint-plugin-import": "2.31.0",
-    "eslint-plugin-prettier": "3.3.1",
     "http-server": "14.1.1",
     "husky": "7.0.4",
     "jsdom": "22.1.0",
     "lint-staged": "12.3.7",
+    "oxfmt": "0.26.0",
+    "oxlint": "1.41.0",
     "pepjs": "0.5.3",
-    "prettier": "2.6.2",
     "rewire": "6.0.0",
     "rimraf": "^5.0.0",
     "typescript": "5.9.3",
     "vite": "5.0.12",
     "vite-plugin-checker": "0.7.2",
     "vite-plugin-ejs": "1.7.0",
+    "vite-plugin-oxlint": "github:dwelle/vite-plugin-oxlint",
     "vite-plugin-pwa": "0.21.1",
     "vite-plugin-svgr": "4.2.0",
     "vitest": "3.0.6",
@@ -47,7 +42,7 @@
     "node": ">=18.0.0"
   },
   "homepage": ".",
-  "prettier": "@excalidraw/prettier-config",
+
   "scripts": {
     "build-node": "node ./scripts/build-node.js",
     "build:app:docker": "yarn --cwd ./excalidraw-app build:app:docker",
@@ -65,21 +60,21 @@
     "start:example": "yarn build:packages && yarn --cwd ./examples/with-script-in-browser start",
     "test:all": "yarn test:typecheck && yarn test:code && yarn test:other && yarn test:app --watch=false",
     "test:app": "vitest",
-    "test:code": "eslint --max-warnings=0 --ext .js,.ts,.tsx .",
-    "test:other": "yarn prettier --list-different",
+    "test:code": "oxlint .",
+    "test:other": "oxfmt --check .",
     "test:typecheck": "tsc",
     "test:update": "yarn test:app --update --watch=false",
     "test": "yarn test:app",
     "test:coverage": "vitest --coverage",
     "test:coverage:watch": "vitest --coverage --watch",
     "test:ui": "yarn test --ui --coverage.enabled=true",
-    "fix:code": "yarn test:code --fix",
-    "fix:other": "yarn prettier --write",
-    "fix": "yarn fix:other && yarn fix:code",
+    "lint": "oxlint",
+    "lint:fix": "oxlint --fix",
+    "format:fix": "oxfmt",
+    "fix": "yarn lint:fix && yarn format:fix",
     "locales-coverage": "node scripts/build-locales-coverage.js",
     "locales-coverage:description": "node scripts/locales-coverage-description.js",
     "prepare": "husky install",
-    "prettier": "prettier \"**/*.{css,scss,json,md,html,yml}\" --ignore-path=.eslintignore",
     "release": "node scripts/release.js",
     "release:test": "node scripts/release.js --tag=test",
     "release:next": "node scripts/release.js --tag=next",
@@ -91,4 +86,5 @@
   "resolutions": {
     "strip-ansi": "6.0.1"
   }
+  
 }

packages/common/.eslintrc.json

@@ -1,3 +0,0 @@
-{
-  "extends": ["../eslintrc.base.json"]
-}

packages/element/.eslintrc.json

@@ -1,3 +0,0 @@
-{
-  "extends": ["../eslintrc.base.json"]
-}

packages/eslintrc.base.json

@@ -1,21 +0,0 @@
-{
-  "overrides": [
-    {
-      "files": ["src/**/*.{ts,tsx}"],
-      "rules": {
-        "@typescript-eslint/no-restricted-imports": [
-          "error",
-          {
-            "patterns": [
-              {
-                "group": ["../../excalidraw", "../../../packages/excalidraw", "@excalidraw/excalidraw"],
-                "message": "Do not import from '@excalidraw/excalidraw' package anything but types, as this package must be independent.",
-                "allowTypeImports": true
-              }
-            ]
-          }
-        ]
-      }
-    }
-  ]
-}