docs: 📝 adds VSCode instructions for official ESlint > v9.9.0 (#268)

.changeset/small-rivers-pump.md

@@ -0,0 +1,7 @@
+---
+'@sherifforg/create-config': minor
+---
+
+feature(cli): removed eslint-ts-patch
+Fixes [#201](https://github.com/AndreaPontrandolfo/sheriff/issues/201)
+Fixes [#268](https://github.com/AndreaPontrandolfo/sheriff/issues/268)

.github/workflows/release.yml

@@ -6,6 +6,10 @@ on:
 
 concurrency: ${{ github.workflow }}-${{ github.ref }}
 
+permissions:
+  contents: write
+  id-token: write
+
 jobs:
   release:
     name: Release

apps/docs-website/docs/setup/manual-setup.mdx

@@ -70,10 +70,7 @@ Follow these steps:
 
     If you want to have a `.ts` configuration file instead of the default `.js` file, follow these steps:
 
-      -
-        ```bash npm2yarn
-        npm install -D eslint-ts-patch eslint@npm:eslint-ts-patch
-        ```
+      - make sure your installed ESLint version is `>=9.9.0`
       - change the extension of `eslint.config.mjs` from `.mjs` to `.ts`
       - define the types of the `sheriffOptions` object:
 

apps/docs-website/docs/typescript-support/eslint-config-ts.md

@@ -6,9 +6,14 @@ sidebar_position: 1
 
 The `eslint.config.ts` file is a Typescript-enabled version of the `eslint.config.js` file.
 
-To make this feature possible, Sheriff leverage [eslint-ts-patch](https://github.com/antfu/eslint-ts-patch) under the hood.<br/>
-To learn more, consult the [official documentation of eslint-ts-patch](https://github.com/antfu/eslint-ts-patch).
-
 If you go through the [automatic setup](../setup/automatic-setup.mdx) of Sheriff, at some point the wizard will ask you if you want to setup Sheriff with a `eslint.config.ts` file instead of the default `eslint.config.js` file. Choose `yes` if you want to have a typesafe ESLint configuration file.
 
 Instead, if you choose the manual installation, follow the instruction in the [manual setup page](../setup/manual-setup.mdx).
+
+Also check the specific docs for the [VSCode integration](../vscode-support.md#eslintconfigts-support).
+
+:::warning
+
+This feature is available only with ESLint version `>=9.9.0`.
+
+:::

apps/docs-website/docs/vscode-support.md

@@ -19,6 +19,16 @@ To make the [VSCode ESLint Extension](https://marketplace.visualstudio.com/items
 }
 ```
 
+## `eslint.config.ts` support
+
+If you are using the `eslint.config.ts` config, add this to your `.vscode/settings.json`:
+
+```JSONC title=".vscode/settings.json"
+"eslint.options": {
+  "flags": ["unstable_ts_config"]
+}
+```
+
 ## Astro support
 
 For [Astro](https://astro.build/) projects, add the astro extension too:

apps/docs-website/docusaurus.config.ts

@@ -22,7 +22,7 @@ const config: Config = {
   baseUrl: '/',
 
   future: {
-    experimental_faster: true,
+    experimental_faster: false,
   },
 
   // GitHub pages deployment config.

packages/sheriff-create-config/src/index.ts

@@ -5,7 +5,7 @@ import yargs from 'yargs';
 import { hideBin } from 'yargs/helpers';
 import packageJson from '../package.json';
 import { askForCustomPath } from './utils/askForCustomPath';
-import { askForEslintTsPatch } from './utils/askForEslintTsPatch';
+import { askForEslintTsConfig } from './utils/askForEslintTsConfig';
 import { askForPrettierSupport } from './utils/askForPrettierSupport';
 import { setDependencies } from './utils/setDependencies';
 import { setEslintConfig } from './utils/setEslintConfig';
@@ -33,15 +33,15 @@ async function main() {
   const hasLocalPrettierSupport = isWorkspace
     ? await askForPrettierSupport()
     : false;
-  const isEslintTsPatchRequired = await askForEslintTsPatch();
+  const isEslintTsConfig = await askForEslintTsConfig();
 
-  await setEslintConfig(isEslintTsPatchRequired, customProjectRootPath);
+  await setEslintConfig(isEslintTsConfig, customProjectRootPath);
 
   if (!isWorkspace || hasLocalPrettierSupport) {
     await setPrettierConfig(customProjectRootPath);
     await setPrettierIgnore(customProjectRootPath);
   }
-  await setDependencies(isEslintTsPatchRequired, customProjectRootPath);
+  await setDependencies(customProjectRootPath);
   consola.info("You're all set!");
 }
 

packages/sheriff-create-config/src/utils/askForEslintTsConfig.ts

@@ -0,0 +1,13 @@
+import { colors } from 'consola/utils';
+import { customConsolaPrompt } from './customConsolaPrompt';
+
+export const askForEslintTsConfig = async (): Promise<boolean> => {
+  const isEslintTsConfig = await customConsolaPrompt(
+    `Do you prefer the config as a Typescript file? The generated config will be a ${colors.bold('eslint.config.ts')} file`,
+    {
+      type: 'confirm',
+    },
+  );
+
+  return isEslintTsConfig;
+};

packages/sheriff-create-config/src/utils/getRequiredPackages.ts

@@ -1,8 +1,6 @@
 import { consola } from 'consola';
 
-export const getRequiredPackages = (
-  isEslintTsPatchRequired: boolean,
-): string[] => {
+export const getRequiredPackages = (): string[] => {
   const requiredPackages: string[] = [];
 
   requiredPackages.push('eslint');
@@ -14,10 +12,5 @@ export const getRequiredPackages = (
   requiredPackages.push('eslint-config-sheriff');
   consola.start("Installing 'eslint-config-sheriff'...");
 
-  if (isEslintTsPatchRequired) {
-    requiredPackages.push(`eslint-ts-patch`, `eslint@npm:eslint-ts-patch`);
-    consola.start("Installing 'eslint-ts-patch'...");
-  }
-
   return requiredPackages;
 };

packages/sheriff-create-config/src/utils/setDependencies.ts

@@ -2,10 +2,9 @@ import { autoInstallPackages } from './autoInstallPackages';
 import { getRequiredPackages } from './getRequiredPackages';
 
 export const setDependencies = async (
-  isEslintTsPatchRequired: boolean,
   customProjectRootPath: string | null,
 ): Promise<void> => {
-  const packages = getRequiredPackages(isEslintTsPatchRequired);
+  const packages = getRequiredPackages();
 
   await autoInstallPackages(packages, customProjectRootPath);
 };

packages/sheriff-create-config/src/utils/setEslintConfig.ts

@@ -7,7 +7,7 @@ import { patchedFindUp } from './patchedFindUp';
 import { throwError } from './throwError';
 
 export const setEslintConfig = async (
-  isEslintTsPatchRequired: boolean,
+  isEslintTsConfig: boolean,
   customProjectRootPath: string | null,
 ): Promise<void> => {
   const ESLINT_CONFIG_JS_FILE_NAME = 'eslint.config.js';
@@ -52,7 +52,7 @@ export const setEslintConfig = async (
 
     consola.start(
       `No ESLint config files were found. Generating and configuring ${
-        isEslintTsPatchRequired
+        isEslintTsConfig
           ? colors.bold(ESLINT_CONFIG_TS_FILE_NAME)
           : colors.bold(ESLINT_CONFIG_JS_FILE_NAME)
       } file...`,
@@ -62,7 +62,7 @@ export const setEslintConfig = async (
       'If you have other ESLint configs in your project, remove them',
     );
 
-    if (isEslintTsPatchRequired) {
+    if (isEslintTsConfig) {
       createFile(
         ESLINT_CONFIG_TS_FILE_NAME,
         await getEslintConfigRawText('ts', customProjectRootPath),