Publish inline-email as ESM

dansabin · dansabin · commit ce96371f9257 · 2026-06-08T10:28:00.000-05:00
diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml
@@ -25,8 +25,8 @@ jobs:
 
       - run: npm install
       - run: npm audit --audit-level=high
-      - run: npm test
       - run: npm run build
+      - run: npm test
       - name: Verify tag matches package version
         run: node -e "const pkg = require('./package.json'); const expected = 'v' + pkg.version; if (process.env.GITHUB_REF_NAME !== expected) { throw new Error('Tag ' + process.env.GITHUB_REF_NAME + ' does not match package version ' + expected); }"
       - name: Resolve npm dist tag
diff --git a/examples/integrations/node-send.js b/examples/integrations/node-send.js
@@ -1,7 +1,9 @@
-const { readFileSync } = require('node:fs');
-const { join } = require('node:path');
-const { compileEmailTemplate } = require('../../dist');
+import { readFileSync } from 'node:fs';
+import { dirname, join } from 'node:path';
+import { fileURLToPath } from 'node:url';
+import { compileEmailTemplate } from '../../dist/index.js';
 
+const __dirname = dirname(fileURLToPath(import.meta.url));
 const rootDir = join(__dirname, '..', '..');
 const template = readFileSync(join(rootDir, 'examples', 'auth', 'welcome-verify.html'), 'utf8');
 const css = readFileSync(join(rootDir, 'examples', 'auth', 'shared.css'), 'utf8');
diff --git a/examples/integrations/preview-server.js b/examples/integrations/preview-server.js
@@ -1,8 +1,10 @@
-const { createServer } = require('node:http');
-const { readFileSync } = require('node:fs');
-const { join } = require('node:path');
-const { compileEmailTemplate } = require('../../dist');
+import { readFileSync } from 'node:fs';
+import { createServer } from 'node:http';
+import { dirname, join } from 'node:path';
+import { fileURLToPath } from 'node:url';
+import { compileEmailTemplate } from '../../dist/index.js';
 
+const __dirname = dirname(fileURLToPath(import.meta.url));
 const rootDir = join(__dirname, '..', '..');
 const host = '127.0.0.1';
 const port = Number(process.env.PORT || 4174);
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,7 +1,8 @@
 {
   "name": "inline-email",
-  "version": "3.0.0",
+  "version": "3.0.1",
   "description": "Modern email template compilation and rendering for safe HTML email.",
+  "type": "module",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "publishConfig": {
@@ -10,7 +11,7 @@
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
-      "require": "./dist/index.js"
+      "import": "./dist/index.js"
     }
   },
   "files": [
@@ -25,7 +26,7 @@
     "examples": "npm run build && node scripts/render-examples.js",
     "examples:serve": "npm run examples && node scripts/serve-examples.js",
     "examples:auth": "npm run examples",
-    "prepublishOnly": "npm test && npm run build",
+    "prepublishOnly": "npm run build && npm test",
     "prepack": "npm run build",
     "test": "vitest run",
     "test:visual": "playwright test",
diff --git a/scripts/render-examples.js b/scripts/render-examples.js
@@ -1,7 +1,9 @@
-const { copyFileSync, mkdirSync, readFileSync, writeFileSync } = require('node:fs');
-const { basename, join } = require('node:path');
-const { compileEmailTemplate } = require('../dist');
+import { copyFileSync, mkdirSync, readFileSync, writeFileSync } from 'node:fs';
+import { basename, dirname, join } from 'node:path';
+import { fileURLToPath } from 'node:url';
+import { compileEmailTemplate } from '../dist/index.js';
 
+const __dirname = dirname(fileURLToPath(import.meta.url));
 const rootDir = join(__dirname, '..');
 const examplesDir = join(rootDir, 'examples');
 const outputDir = join(examplesDir, 'out');
diff --git a/scripts/serve-examples.js b/scripts/serve-examples.js
@@ -1,7 +1,9 @@
-const { createReadStream, existsSync, statSync } = require('node:fs');
-const { createServer } = require('node:http');
-const { extname, join, normalize } = require('node:path');
+import { createReadStream, existsSync, statSync } from 'node:fs';
+import { createServer } from 'node:http';
+import { dirname, extname, join, normalize } from 'node:path';
+import { fileURLToPath } from 'node:url';
 
+const __dirname = dirname(fileURLToPath(import.meta.url));
 const rootDir = join(__dirname, '..');
 const outputDir = join(rootDir, 'examples', 'out');
 const host = '127.0.0.1';
diff --git a/src/cli.ts b/src/cli.ts
@@ -1,7 +1,8 @@
 #!/usr/bin/env node
 
 import { existsSync, readFileSync, writeFileSync } from 'node:fs';
-import { compileEmailTemplate } from './compile';
+import { pathToFileURL } from 'node:url';
+import { compileEmailTemplate } from './compile.js';
 
 interface CliOptions {
   html?: string;
@@ -158,7 +159,7 @@ Options:
 
 class CliError extends Error {}
 
-if (require.main === module) {
+if (process.argv[1] && import.meta.url === pathToFileURL(process.argv[1]).href) {
   main(process.argv.slice(2)).catch((error: Error) => {
     console.error('\x1b[31m%s\x1b[0m', error.message);
     console.error(usage());
diff --git a/src/compile.ts b/src/compile.ts
@@ -1,7 +1,7 @@
 import juice from 'juice';
-import { renderResponsiveLayout } from './layout';
-import { applyEmailStyle } from './style';
-import { renderTemplate } from './template';
+import { renderResponsiveLayout } from './layout.js';
+import { applyEmailStyle } from './style.js';
+import { renderTemplate } from './template.js';
 import type {
   CompiledEmailTemplate,
   CompileEmailTemplateOptions,
@@ -12,7 +12,7 @@ import type {
   RenderEmailOptions,
   RenderedEmail,
   TemplateTransform
-} from './types';
+} from './types.js';
 
 const DEFAULT_JUICE_OPTIONS: JuiceOptions = {
   webResources: {
diff --git a/src/index.ts b/src/index.ts
@@ -2,10 +2,10 @@ export {
   compileEmailTemplate,
   inlineEmailHtml,
   renderEmail
-} from './compile';
+} from './compile.js';
 
-export { renderTemplate } from './template';
-export { renderResponsiveLayout } from './layout';
+export { renderTemplate } from './template.js';
+export { renderResponsiveLayout } from './layout.js';
 
 export type {
   CompiledEmailTemplate,
@@ -20,4 +20,4 @@ export type {
   TemplateData,
   TemplateTransform,
   TemplateValue
-} from './types';
+} from './types.js';
diff --git a/src/style.ts b/src/style.ts
@@ -1,4 +1,4 @@
-import type { EmailStyle, EmailStyleVariant } from './types';
+import type { EmailStyle, EmailStyleVariant } from './types.js';
 
 type StyleTarget = 'container' | 'content';
 
diff --git a/src/template.ts b/src/template.ts
@@ -1,4 +1,4 @@
-import type { RenderData, TemplateData, TemplateValue } from './types';
+import type { RenderData, TemplateData, TemplateValue } from './types.js';
 
 const BLOCK_PATTERN = /{{#\s*([A-Za-z0-9_.-]+)\s*}}([\s\S]*?){{\/\s*\1\s*}}/g;
 const SLOT_PATTERN = /{{\s*slot:([A-Za-z0-9_.-]+)\s*}}/g;
diff --git a/test/cli.test.ts b/test/cli.test.ts
@@ -1,5 +1,5 @@
 import { describe, expect, it } from 'vitest';
-import { parseArgs } from '../src/cli';
+import { parseArgs } from '../src/cli.ts';
 
 describe('parseArgs', () => {
   it('supports legacy --css style.css input.html ordering', () => {
diff --git a/test/compile.test.ts b/test/compile.test.ts
@@ -1,5 +1,5 @@
 import { describe, expect, it } from 'vitest';
-import { compileEmailTemplate, inlineEmailHtml, renderEmail } from '../src';
+import { compileEmailTemplate, inlineEmailHtml, renderEmail } from '../src/index.ts';
 
 describe('compileEmailTemplate', () => {
   it('inlines CSS once and renders dynamic data later', async () => {
diff --git a/test/esm-package.test.ts b/test/esm-package.test.ts
@@ -0,0 +1,25 @@
+import { describe, expect, it } from 'vitest';
+import { join } from 'node:path';
+import { pathToFileURL } from 'node:url';
+
+describe('published ESM package shape', () => {
+  it('imports the built package and renders through juice without CommonJS require', async () => {
+    const packageUrl = pathToFileURL(join(process.cwd(), 'dist', 'index.js')).href;
+    const { renderEmail } = await import(packageUrl);
+
+    const email = await renderEmail({
+      template: {
+        subject: 'Hello {{name}}',
+        html: '<p class="message">Hello {{name}}</p>',
+        css: '.message { color: #246bfe; }'
+      },
+      data: {
+        name: 'Dan'
+      }
+    });
+
+    expect(email.subject).toBe('Hello Dan');
+    expect(email.html).toContain('Hello Dan');
+    expect(email.html).toContain('style="color: #246bfe;"');
+  });
+});
diff --git a/test/examples.test.ts b/test/examples.test.ts
@@ -1,8 +1,10 @@
 import { readFileSync } from 'node:fs';
-import { join } from 'node:path';
+import { dirname, join } from 'node:path';
+import { fileURLToPath } from 'node:url';
 import { describe, expect, it } from 'vitest';
-import { compileEmailTemplate } from '../src';
+import { compileEmailTemplate } from '../src/index.ts';
 
+const __dirname = dirname(fileURLToPath(import.meta.url));
 const rootDir = join(__dirname, '..');
 const examplesDir = join(rootDir, 'examples');
 const sharedCss = readFileSync(join(examplesDir, 'auth', 'shared.css'), 'utf8');
diff --git a/test/layout.test.ts b/test/layout.test.ts
@@ -1,5 +1,5 @@
 import { describe, expect, it } from 'vitest';
-import { compileEmailTemplate, renderResponsiveLayout } from '../src';
+import { compileEmailTemplate, renderResponsiveLayout } from '../src/index.ts';
 
 describe('renderResponsiveLayout', () => {
   it('renders semantic email tags into responsive table markup', () => {
diff --git a/test/template.test.ts b/test/template.test.ts
@@ -1,5 +1,5 @@
 import { describe, expect, it } from 'vitest';
-import { renderTemplate } from '../src/template';
+import { renderTemplate } from '../src/template.ts';
 
 describe('renderTemplate', () => {
   it('escapes normal variables by default', () => {
diff --git a/tsconfig.json b/tsconfig.json
@@ -1,8 +1,8 @@
 {
   "compilerOptions": {
     "target": "ES2022",
-    "module": "CommonJS",
-    "moduleResolution": "Node",
+    "module": "NodeNext",
+    "moduleResolution": "NodeNext",
     "lib": ["ES2022"],
     "rootDir": "src",
     "outDir": "dist",
