feat: upgrade dependencies

eslint.config.mjs

@@ -0,0 +1,60 @@
+// @ts-check
+import globals from "globals";
+import eslint from "@eslint/js";
+import tseslint from "typescript-eslint";
+import prettierLintRecommended from "eslint-plugin-prettier/recommended";
+import jest from "eslint-plugin-jest";
+
+/**
+ * @typedef {import('@typescript-eslint/utils').TSESLint.FlatConfig.Config["rules"]} ESLintRules
+ * @typedef {import('@typescript-eslint/utils').TSESLint.FlatConfig.Config["languageOptions"]} LanguageOptions
+ */
+
+/** @type {ESLintRules} */
+const BASE_RULES = {
+  "@typescript-eslint/camelcase": 0,
+  "@typescript-eslint/explicit-function-return-type": 0,
+  "@typescript-eslint/explicit-module-boundary-types": 0,
+  "@typescript-eslint/no-explicit-any": 0,
+  "@typescript-eslint/no-unused-vars": ["error", { argsIgnorePattern: "^_" }],
+  "@typescript-eslint/no-var-requires": 0,
+  "@typescript-eslint/ban-ts-comment": 1,
+  "prettier/prettier": "error",
+  "no-console": "error",
+};
+
+/** @type {LanguageOptions} */
+const BASE_LANGUAGE_OPTIONS = {
+  ecmaVersion: 2022,
+  sourceType: "module",
+  globals: {
+    ...globals.browser,
+    ...globals.node,
+  },
+};
+
+export default tseslint.config(
+  eslint.configs.recommended,
+  prettierLintRecommended,
+  ...tseslint.configs.recommended,
+  {
+    files: ["src/**/*.ts"],
+    ignores: ["out/", "src/test/", "src/scripts/"],
+    languageOptions: {
+      ...BASE_LANGUAGE_OPTIONS,
+    },
+    rules: BASE_RULES,
+  },
+  {
+    files: ["src/test/**/*.ts"],
+    ignores: ["out/", "src/scripts/"],
+    ...jest.configs["flat/recommended"],
+    languageOptions: {
+      ...BASE_LANGUAGE_OPTIONS,
+    },
+    rules: {
+      ...jest.configs["flat/recommended"].rules,
+      ...BASE_RULES,
+    },
+  }
+);

examples/basics/local.css

@@ -15,5 +15,5 @@ body {
   width: var(--container-size);
   padding: var(--container-padding);
   background-color: var(--test-custom-selector);
-  color: --gray
+  color: var(--gray-1);
 }

examples/js-parser/src/App.tsx

@@ -1,7 +1,7 @@
 import { css } from "@linaria/core";
 
 const rootClass = css`
-  color: var(--brand);
+  color: var(--color-green);
   background-color: var(--color-blue);
 
   .head {

examples/js-parser/src/global/Layout.tsx

@@ -1,4 +1,3 @@
-/* eslint-disable no-console */
 import { styled } from "@linaria/react";
 
 export default styled.div`
@@ -8,7 +7,7 @@ export default styled.div`
     --h3: 24px;
 
     --color-red: red;
-    --color-green: green;
+    --color-green: lab(50.22% -49 38.39);
     --color-blue: blue;
   }
 `;

package.json

@@ -414,56 +414,58 @@
 		"prebuild": "rimraf out",
 		"build": "cross-env NODE_ENV=production rollup -c --environment INCLUDE_DEPS,BUILD,NODE_ENV:production",
 		"watch": "rollup -c -m -w",
-		"lint": "eslint src --ext ts",
-		"lint:fix": "eslint src --ext ts --fix",
+		"lint": "eslint src",
+		"lint:fix": "eslint src --fix",
 		"test": "concurrently \"tsc --project ./tsconfig.json --noEmit\" \"jest\"",
 		"jest": "jest"
 	},
 	"devDependencies": {
-		"@babel/core": "^7.17.8",
-		"@babel/preset-env": "^7.16.11",
-		"@babel/preset-typescript": "^7.16.7",
-		"@rollup/plugin-commonjs": "^18.1.0",
-		"@rollup/plugin-json": "^4.1.0",
-		"@rollup/plugin-node-resolve": "^11.2.1",
-		"@rollup/plugin-replace": "^4.0.0",
+		"@babel/core": "^7.25.2",
+		"@babel/preset-env": "^7.25.4",
+		"@babel/preset-typescript": "^7.24.7",
+		"@eslint/js": "^9.11.1",
+		"@rollup/plugin-commonjs": "^28.0.0",
+		"@rollup/plugin-json": "^6.1.0",
+		"@rollup/plugin-node-resolve": "^15.3.0",
+		"@rollup/plugin-replace": "^6.0.1",
 		"@tokencss/postcss": "^0.0.5",
-		"@types/css": "^0.0.31",
-		"@types/glob": "^7.2.0",
-		"@types/jest": "^29.1.2",
-		"@types/lodash": "^4.14.180",
-		"@types/node": "^18.11.0",
-		"@types/postcss-less": "^4.0.2",
-		"@types/postcss-safe-parser": "^5.0.1",
-		"@types/vscode": "1.53.0",
-		"@typescript-eslint/eslint-plugin": "^5.40.0",
-		"@typescript-eslint/parser": "^5.40.0",
-		"babel-jest": "^29.2.0",
-		"concurrently": "^7.3.0",
+		"@types/css": "^0.0.37",
+		"@types/eslint__js": "^8.42.3",
+		"@types/glob": "^8.1.0",
+		"@types/jest": "^29.5.13",
+		"@types/lodash": "^4.17.9",
+		"@types/node": "^18.19.50",
+		"@types/postcss-less": "^4.0.6",
+		"@types/postcss-safe-parser": "^5.0.4",
+		"@types/vscode": "1.93.0",
+		"babel-jest": "^29.7.0",
+		"concurrently": "^9.0.1",
 		"cross-env": "^7.0.3",
-		"dayjs": "^1.11.5",
-		"dotenv": "^16.0.2",
-		"esbuild": "^0.14.49",
-		"eslint": "^8.25.0",
-		"eslint-config-prettier": "^8.5.0",
-		"eslint-plugin-jest": "^27.1.2",
-		"eslint-plugin-prettier": "^3.4.1",
-		"husky": "^5.2.0",
-		"jest": "^29.2.0",
-		"lint-staged": "^10.5.4",
+		"dayjs": "^1.11.13",
+		"dotenv": "^16.4.5",
+		"esbuild": "^0.24.0",
+		"eslint": "^9.11.1",
+		"eslint-config-prettier": "^9.1.0",
+		"eslint-plugin-jest": "^28.8.3",
+		"eslint-plugin-prettier": "^5.2.1",
+		"globals": "^15.9.0",
+		"husky": "^9.1.6",
+		"jest": "^29.7.0",
+		"lint-staged": "^15.2.10",
 		"lodash": "^4.17.21",
-		"prettier": "^2.6.1",
-		"rimraf": "^3.0.2",
-		"rollup": "^2.70.1",
-		"rollup-plugin-esbuild": "^4.9.1",
-		"typescript": "^4.8.4",
-		"yargs": "^17.5.1"
+		"prettier": "^3.3.3",
+		"rimraf": "^6.0.1",
+		"rollup": "^4.22.4",
+		"rollup-plugin-esbuild": "^6.1.1",
+		"typescript": "5.5.2",
+		"typescript-eslint": "^8.7.0",
+		"yargs": "^17.7.2"
 	},
 	"dependencies": {
 		"culori": "^2.0.3",
-		"fast-glob": "^3.2.12",
-		"follow-redirects": "^1.15.2",
-		"postcss": "^8.4.12",
+		"fast-glob": "^3.3.2",
+		"follow-redirects": "^1.15.9",
+		"postcss": "^8.4.47",
 		"postcss-less": "^6.0.0"
 	},
 	"lint-staged": {

rollup.config.js → rollup.config.mjs

@@ -3,8 +3,8 @@ import commonjs from "@rollup/plugin-commonjs";
 import replace from "@rollup/plugin-replace";
 import json from "@rollup/plugin-json";
 import esbuild from "rollup-plugin-esbuild";
-import pkg from "./package.json";
-import tsConfig from "./tsconfig.json";
+import pkg from "./package.json" with { type: "json" };
+import tsConfig from "./tsconfig.json" with { type: "json" };
 
 const isProd = process.env.NODE_ENV === "production";
 

src/constants.ts

@@ -18,10 +18,10 @@ export const CSS_IDS = [
   "astro",
 ] as const;
 export const SUPPORTED_LANGUAGE_IDS = [...CSS_IDS, ...JS_IDS] as const;
-export type SupportedLanguageIds = typeof SUPPORTED_LANGUAGE_IDS[number];
+export type SupportedLanguageIds = (typeof SUPPORTED_LANGUAGE_IDS)[number];
 export type ExtendedLanguageIds = "stylus" | "sugarss" | "handlebars";
 export type CssExtensions = Exclude<
-  typeof CSS_IDS[number],
+  (typeof CSS_IDS)[number],
   "vue" | "svelte" | "astro"
 >;
 

src/parser.ts

@@ -85,9 +85,12 @@ const cssParseAsync = async (
 
   if (syntaxModuleName) {
     try {
-      options.syntax = require(require.resolve(syntaxModuleName, {
-        paths: rootPathsOrUndefined,
-      }));
+      // eslint-disable-next-line @typescript-eslint/no-require-imports
+      options.syntax = require(
+        require.resolve(syntaxModuleName, {
+          paths: rootPathsOrUndefined,
+        })
+      );
     } catch (e: any) {
       window.showErrorMessage(
         `Cannot resolve postcss syntax module ${syntaxModuleName}. Please add postcss@8 as project's dependency.`
@@ -412,19 +415,22 @@ const parseFilesForSingleFolder = async function (
     try {
       const [vars, cssVarsMap] = await populateValue(cssVars);
       CACHE.cssVarCount[rootPath] = vars.length;
-      CACHE.cssVarDefinitionsMap[rootPath] = vars.reduce((defs, cssVar) => {
-        if (!cssVar.location) {
-          return defs;
-        }
+      CACHE.cssVarDefinitionsMap[rootPath] = vars.reduce(
+        (defs, cssVar) => {
+          if (!cssVar.location) {
+            return defs;
+          }
 
-        const key = cssVar.property;
-        if (key in defs) {
-          defs[key].push(cssVar.location);
-        } else {
-          defs[key] = [cssVar.location];
-        }
-        return defs;
-      }, {} as CacheType["cssVarDefinitionsMap"][string]);
+          const key = cssVar.property;
+          if (key in defs) {
+            defs[key].push(cssVar.location);
+          } else {
+            defs[key] = [cssVar.location];
+          }
+          return defs;
+        },
+        {} as CacheType["cssVarDefinitionsMap"][string]
+      );
       CACHE.cssVarsMap[rootPath] = cssVarsMap;
     } catch (e) {
       window.showErrorMessage(`Populating Variable Values: ${e}`);

src/scripts/create-changelog.js

@@ -1,5 +1,6 @@
 #!/usr/bin/env node
-/* eslint-disable no-console */
+/* eslint-disable no-undef */
+/* eslint-disable @typescript-eslint/no-require-imports */
 
 /**
  * Usage:
@@ -41,17 +42,19 @@ const gitLog = () =>
 
 const processCommitMsg = (/** @type {string[]} */ msgTokens) => {
   return msgTokens.map(token => {
-    return token.trim().replace(
-      /(\[?#(\d+)\]?)/,
-      "$1(https://github.com/willofindie/vscode-cssvar/issues/$2)"
-    );
+    return token
+      .trim()
+      .replace(
+        /(\[?#(\d+)\]?)/,
+        "$1(https://github.com/willofindie/vscode-cssvar/issues/$2)"
+      );
   });
 };
 
 (async () => {
   try {
     const log = await gitLog();
-    const [_, releaseTag] = compareString.split("...");
+    const [, releaseTag] = compareString.split("...");
     const filtered = log
       .split("\n")
       .filter(line => /\d{4}-\d{2}-\d{2}/.test(line))

src/scripts/publish.js

@@ -1,4 +1,6 @@
 #!/usr/bin/env node
+/* eslint-disable no-undef */
+/* eslint-disable @typescript-eslint/no-require-imports */
 // @ts-check
 const { spawn } = require("node:child_process");
 require("dotenv").config();
@@ -26,7 +28,7 @@ Promise.all([spawnAsync("yarn", "test"), spawnAsync("yarn", "build")])
       spawnAsync("ovsx", "publish", "-p", process.env.OVSX_KEY),
     ]);
   })
-  .catch((reason)=> {
+  .catch(reason => {
     console.error(reason);
     process.exit(1);
   });

src/test/color-parser.test.ts

@@ -88,4 +88,4 @@ describe("Failures color-parser", () => {
     expect(result.isColor).toBeFalsy();
     expect(result.color).toBe("color(display-p3 1 0.5 0)");
   });
-})
+});

src/test/config.test.ts

@@ -1,9 +1,5 @@
 import { workspace } from "vscode";
-import {
-  DEFAULT_CONFIG,
-  CACHE,
-  WorkspaceConfig,
-} from "../constants";
+import { DEFAULT_CONFIG, CACHE, WorkspaceConfig } from "../constants";
 import { setup } from "../main";
 
 jest.mock("../constants", () => ({
@@ -27,7 +23,7 @@ beforeEach(() => {
 });
 
 beforeAll(() => {
-  // @ts-ignore
+  // @ts-expect-error workspaceFolders is readonly
   workspace.workspaceFolders = [
     {
       uri: {
@@ -44,7 +40,8 @@ beforeAll(() => {
 });
 
 afterAll(() => {
-  // @ts-ignore Reset to default
+  // Reset to default
+  // @ts-expect-error workspaceFolders is readonly
   workspace.workspaceFolders = [];
   jest.clearAllMocks();
 });