feat: isolationDeclarations (#930)

VKCOM · Oct 2, 2024 · c8f8f6b · c8f8f6b
1 parent 9b59122
commit c8f8f6b
Show file tree

Hide file tree

Showing 6 changed files with 40 additions and 73 deletions.
diff --git a/packages/icons-scripts/package.json b/packages/icons-scripts/package.json
@@ -18,7 +18,9 @@
     "@swc/core": "^1.7.26",
     "glob": "^11.0.0",
     "svg-baker": "^1.7.0",
-    "svgo": "^3.3.2",
+    "svgo": "^3.3.2"
+  },
+  "devDependencies": {
     "typescript": "^5.6.2"
   },
   "packageManager": "yarn@3.6.0",

diff --git a/packages/icons-scripts/scripts/configs/.swcrc b/packages/icons-scripts/scripts/configs/.swcrc
@@ -1,12 +1,12 @@
 {
-  "$schema": "https://json.schemastore.org/swcrc",
+  "$schema": "https://swc.rs/schema.json",
   "jsc": {
     "parser": {
       "syntax": "typescript",
       "tsx": true
+    },
+    "experimental": {
+      "emitIsolatedDts": true
     }
-  },
-  "env": {
-    "coreJs": 3
   }
 }
diff --git a/packages/icons-scripts/scripts/icons.js b/packages/icons-scripts/scripts/icons.js
@@ -2,14 +2,14 @@ const fs = require('fs');
 const path = require('path');
 const glob = require('glob');
 const { performance } = require('perf_hooks');
-const { execSync } = require('child_process');
+const util = require('node:util');
+const exec = util.promisify(require('node:child_process').exec);
 const { debugInfo, debugError, sortArrayAlphabetically } = require('./utils');
 const { createIconsMap } = require('./icons-map');
 const { prepareOptions } = require('./options');
 const { optimize } = require('./optimize');
 const { createReactIcon } = require('./output');
 const { generateRasterIcons } = require('./raster/icons');
-const tsc = require('./tsc');
 
 /**
  * @typedef {import('./options').GenerateOptions} GenerateOptions
@@ -161,23 +161,36 @@ function generateIcons(options) {
       debugError('swc config not found');
     }
 
-    debugInfo('Running swc commonjs...');
-    execSync(
-      `swc ${tsFilesDirectory} --strip-leading-paths -d ${distDirectory}/ --config-file ${swcConfig} -C module.type=commonjs`,
-    );
+    debugInfo('Running swc...');
 
-    debugInfo('Running swc es6...');
-    execSync(
-      `swc ${tsFilesDirectory} --strip-leading-paths -d ${distES6Directory}/ --config-file ${swcConfig}`,
-    );
+    await Promise.all([
+      exec(
+        `swc ${tsFilesDirectory} --strip-leading-paths -d ${distDirectory}/ --config-file ${swcConfig} -C module.type=commonjs`,
+      ),
+      exec(
+        `swc ${tsFilesDirectory} --strip-leading-paths -d ${distES6Directory}/ --config-file ${swcConfig}`,
+      ),
+    ]);
 
-    debugInfo('Running tsc...');
-    const tsFiles = [
-      ...glob.sync(path.posix.join(tsFilesDirectory, '**', '*.ts')),
-      ...glob.sync(path.posix.join(tsFilesDirectory, '*.ts')),
-    ];
+    debugInfo('Copy declarations');
 
-    tsc.compile(tsFiles, path.join(distDirectory, 'typings'));
+    /**
+     * Копирует файлы с декларациями в папку distDirectory/typings
+     *
+     * @param {string} file
+     */
+    const copyFile = async (file) => {
+      const relativePath = path.relative(distDirectory, file);
+
+      await fs.promises.mkdir(path.join(distDirectory, 'typings', path.dirname(relativePath)), {
+        recursive: true,
+      });
+      await fs.promises.copyFile(file, path.join(distDirectory, 'typings', relativePath));
+    };
+
+    const matches = await glob.glob(`${distDirectory}/**/*.d.ts`);
+
+    await Promise.all(matches.map(copyFile));
   };
 }
 

diff --git a/packages/icons-scripts/scripts/output/react.js b/packages/icons-scripts/scripts/output/react.js
@@ -29,7 +29,7 @@ function createReactIcon({
   // Чтобы nextjs мог рендерить иконки как серверные компоненты
   return `'use client';
 
-import { SVGProps, Ref } from 'react';
+import { SVGProps, Ref, FC } from 'react';
 import { makeIcon } from '@vkontakte/icons-sprite';
 ${subcomponentsImports}
 
@@ -44,7 +44,7 @@ export interface ${componentName}Props extends SVGProps<SVGSVGElement> {
 }
 
 ${jsdoc}
-export const ${componentName} = makeIcon<${componentName}Props, ${typeAssigns}>(
+export const ${componentName}: FC<${componentName}Props> & ${typeAssigns} = makeIcon<${componentName}Props, ${typeAssigns}>(
   '${componentName}',
   '${id}',
   '${viewBox}',

diff --git a/packages/icons-scripts/scripts/raster/output/react.js b/packages/icons-scripts/scripts/raster/output/react.js
@@ -41,15 +41,15 @@ function createReactRasterIcon({ id, size, componentName, ...options }, outputPa
     },
   );
 
-  return `import { ImgHTMLAttributes, Ref } from 'react';
+  return `import { ImgHTMLAttributes, Ref, FC } from 'react';
 import { makeRasterIcon } from '@vkontakte/icons-sprite';
 ${densityBucketSetImports.join('\n')}
 
 export interface ${componentName}Props extends ImgHTMLAttributes<HTMLImageElement> {
   getRootRef?: Ref<HTMLImageElement>;
 }
 
-export const ${componentName} = makeRasterIcon<${componentName}Props>(
+export const ${componentName}: FC<${componentName}Props> = makeRasterIcon<${componentName}Props>(
   '${componentName}',
   '${id}',
   ${size},

diff --git a/packages/icons-scripts/scripts/tsc.js b/packages/icons-scripts/scripts/tsc.js