metrics: Provide ESM entrypoints for individual font metrics

seek-oss · Feb 26, 2024 · aa85e04 · aa85e04
1 parent 6a7a7dc
commit aa85e04
Show file tree

Hide file tree

Showing 5 changed files with 26 additions and 11 deletions.
diff --git a/.changeset/sweet-terms-clap.md b/.changeset/sweet-terms-clap.md
@@ -0,0 +1,7 @@
+---
+'@capsizecss/metrics': minor
+---
+
+metrics: Provide ESM entrypoints for individual font metrics
+
+Build an ESM version of individual font metrics in preparation for adding named exports as part of the upcoming support for non-latin unicode subsets.
diff --git a/packages/metrics/package.json b/packages/metrics/package.json
@@ -41,7 +41,11 @@
       "require": "./dist/entireMetricsCollection.cjs"
     },
     "./package.json": "./package.json",
-    "./*": "./entireMetricsCollection/*.js"
+    "./*": {
+      "types": "./entireMetricsCollection/*.d.ts",
+      "import": "./entireMetricsCollection/*.mjs",
+      "require": "./entireMetricsCollection/*.cjs"
+    }
   },
   "main": "./dist/index.cjs",
   "module": "./dist/index.mjs",

diff --git a/packages/metrics/scripts/clean.ts b/packages/metrics/scripts/clean.ts
@@ -3,5 +3,9 @@ import del from 'del';
 import { metricsDir } from './paths';
 
 (async () => {
-  await del([`${metricsDir}/*.d.ts`, `${metricsDir}/*.js`]);
+  await del([
+    `${metricsDir}/*.d.ts`,
+    `${metricsDir}/*.cjs`,
+    `${metricsDir}/*.mjs`,
+  ]);
 })();
diff --git a/packages/metrics/scripts/generate.ts b/packages/metrics/scripts/generate.ts
@@ -53,9 +53,12 @@ const buildFiles = async ({
 
   allMetrics[fileName] = data;
 
-  const jsOutput = `module.exports = ${JSON.stringify(data, null, 2)
+  const jsOutput = `${JSON.stringify(data, null, 2)
     .replace(/"(.+)":/g, '$1:')
-    .replace(/"/g, `'`)};\n`;
+    .replace(/"/g, `'`)};`;
+
+  const cjsOutput = `module.exports = ${jsOutput}\n`;
+  const mjsOutput = `export default ${jsOutput}\n`;
 
   const typesOutput = dedent`
     declare module '@capsizecss/metrics/${fileName}' {
@@ -102,8 +105,9 @@ const buildFiles = async ({
       export default fontMetrics;
     `;
 
-  await writeMetricsFile(`${fileName}.js`, jsOutput);
-  await writeMetricsFile(`${fileName}.d.ts`, `${typesOutput}}\n`);
+  await writeMetricsFile(`${fileName}.cjs`, cjsOutput);
+  await writeMetricsFile(`${fileName}.mjs`, mjsOutput);
+  await writeMetricsFile(`${fileName}.d.ts`, `${typesOutput}\n}\n`);
 };
 
 (async () => {

diff --git a/site/vite.config.ts b/site/vite.config.ts
@@ -14,10 +14,7 @@ export default defineConfig(() => ({
   build: {
     // These settings only apply on `vite build`
     commonjsOptions: {
-      include: [
-        new RegExp('packages/metrics/entireMetricsCollection'),
-        /node_modules/,
-      ],
+      include: [/node_modules/],
       exclude: [/react-helmet-async/],
       defaultIsModuleExports: true,
     },
@@ -31,7 +28,6 @@ export default defineConfig(() => ({
   plugins: [
     viteCommonjs({
       include: [
-        'packages/metrics/entireMetricsCollection',
         '@emotion/react',
         'hoist-non-react-statics',
         'react-helmet-async',