react-email 1.9.3 → 1.9.4

package/dist/package.json

@@ -1,6 +1,6 @@
 {
     "name": "react-email",
-    "version": "1.9.3",
+    "version": "1.9.4",
     "description": "A live preview of your emails right in your browser.",
     "bin": {
         "email": "./dist/source/index.js"

package/dist/source/commands/export.js

@@ -55,16 +55,22 @@ const exportTemplates = async (outDir, srcDir, options) => {
         write: true,
         outdir: outDir,
     });
+    spinner.succeed();
     const allBuiltTemplates = glob_1.glob.sync((0, normalize_path_1.default)(`${outDir}/*.js`), {
         absolute: true,
     });
     for (const template of allBuiltTemplates) {
+        spinner.text = `rendering ${template.split('/').pop()}`;
+        spinner.render();
         const component = await Promise.resolve(`${template}`).then(s => __importStar(require(s)));
         const rendered = (0, render_1.render)(component.default({}), options);
         const htmlPath = template.replace('.js', options.plainText ? '.txt' : '.html');
         (0, fs_1.writeFileSync)(htmlPath, rendered);
         (0, fs_1.unlinkSync)(template);
     }
+    spinner.succeed('Rendered all files');
+    spinner.text = `Copying static files`;
+    spinner.render();
     const staticDir = path_1.default.join(srcDir, 'static');
     const hasStaticDirectory = fs_2.default.existsSync(staticDir);
     if (hasStaticDirectory) {
@@ -73,6 +79,7 @@ const exportTemplates = async (outDir, srcDir, options) => {
             throw new Error(`Something went wrong while copying the file to ${outDir}/static, ${result.cat()}`);
         }
     }
+    spinner.succeed();
     const fileTree = (0, tree_node_cli_1.default)(outDir, {
         allFiles: true,
         maxDepth: 4,

package/dist/source/utils/generate-email-preview.js

@@ -13,6 +13,12 @@ const path_1 = __importDefault(require("path"));
 const fs_extra_1 = __importDefault(require("fs-extra"));
 const glob_1 = __importDefault(require("glob"));
 const close_ora_on_sigint_1 = require("./close-ora-on-sigint");
+/**
+ * Node.js and imports are requiring all imports to be /, while some functions (like glob) return paths with \ for path separation on windows
+ */
+function osIndependentPath(p) {
+    return p.split(path_1.default.sep).join("/");
+}
 const generateEmailsPreview = async (emailDir, type = 'all') => {
     try {
         const spinner = (0, ora_1.default)('Generating emails preview').start();
@@ -38,7 +44,7 @@ const createEmailPreviews = async (emailDir) => {
     if (hasEmailsDirectory) {
         await fs_1.default.promises.rm(constants_1.PACKAGE_EMAILS_PATH, { recursive: true });
     }
-    const list = glob_1.default.sync(path_1.default.join(emailDir, '/*.{jsx,tsx}'), {
+    const list = glob_1.default.sync(osIndependentPath(path_1.default.join(emailDir, '/*.{jsx,tsx}')), {
         absolute: true,
     });
     /**
@@ -48,11 +54,12 @@ const createEmailPreviews = async (emailDir) => {
      * import Mail from '../../path/to/emails/my-template.tsx`
      * export default Mail
      */
-    for (const absoluteSrcFilePath of list) {
+    for (const _absoluteSrcFilePath of list) {
+        const absoluteSrcFilePath = osIndependentPath(_absoluteSrcFilePath);
         const fileName = absoluteSrcFilePath.split('/').pop();
-        const targetFile = path_1.default.join(constants_1.PACKAGE_EMAILS_PATH, absoluteSrcFilePath.replace(emailDir, ''));
+        const targetFile = path_1.default.join(osIndependentPath(constants_1.PACKAGE_EMAILS_PATH), absoluteSrcFilePath.replace(osIndependentPath(emailDir), ''));
         const importPath = path_1.default.relative(path_1.default.dirname(targetFile), path_1.default.dirname(absoluteSrcFilePath));
-        const importFile = path_1.default.join(importPath, fileName);
+        const importFile = osIndependentPath(path_1.default.join(importPath, fileName));
         // if this import is changed, you also need to update `client/src/app/preview/[slug]/page.tsx`
         const sourceCode = `import Mail from '${importFile}';export default Mail;`.replace(';', ';\n');
         await fs_extra_1.default.ensureDir(path_1.default.dirname(targetFile));

package/dist/source/utils/start-server-command.js

@@ -30,7 +30,7 @@ const buildProdServer = (packageManager) => {
 };
 exports.buildProdServer = buildProdServer;
 // based on https://stackoverflow.com/a/14032965
-function exitHandler() {
+const exitHandler = (options) => (code) => {
     if (processesToKill.length > 0) {
         console.log('shutting down %d subprocesses', processesToKill.length);
     }
@@ -39,13 +39,16 @@ function exitHandler() {
             p.kill();
         }
     });
-}
+    if (options?.exit) {
+        shelljs_1.default.exit(code);
+    }
+};
 // do something when app is closing
-process.on('exit', exitHandler);
+process.on('exit', exitHandler());
 // catches ctrl+c event
-process.on('SIGINT', exitHandler);
+process.on('SIGINT', exitHandler({ exit: true }));
 //  catches "kill pid" (for example: nodemon restart)
-process.on('SIGUSR1', exitHandler);
-process.on('SIGUSR2', exitHandler);
+process.on('SIGUSR1', exitHandler({ exit: true }));
+process.on('SIGUSR2', exitHandler({ exit: true }));
 // catches uncaught exceptions
-process.on('uncaughtException', exitHandler);
+process.on('uncaughtException', exitHandler({ exit: true }));

package/dist/source/utils/watcher.js

@@ -10,11 +10,20 @@ const path_1 = __importDefault(require("path"));
 const shelljs_1 = __importDefault(require("shelljs"));
 const constants_1 = require("./constants");
 const generate_email_preview_1 = require("./generate-email-preview");
-const createWatcherInstance = (watchDir) => chokidar_1.default.watch(watchDir, {
-    ignoreInitial: true,
-    cwd: watchDir.split(path_1.default.sep).slice(0, -1).join(path_1.default.sep),
-    ignored: /(^|[\/\\])\../,
-});
+const createWatcherInstance = (watchDir) => {
+    const watcher = chokidar_1.default.watch(watchDir, {
+        ignoreInitial: true,
+        cwd: watchDir.split(path_1.default.sep).slice(0, -1).join(path_1.default.sep),
+        ignored: /(^|[\/\\])\../,
+    });
+    // Catches ctrl+c event
+    const exit = async () => {
+        await watcher.close();
+    };
+    process.on('SIGINT', exit);
+    process.on('uncaughtException', exit);
+    return watcher;
+};
 exports.createWatcherInstance = createWatcherInstance;
 const watcher = (watcherInstance, watchDir) => {
     watcherInstance.on('all', async (event, filename) => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-email",
-  "version": "1.9.3",
+  "version": "1.9.4",
   "description": "A live preview of your emails right in your browser.",
   "bin": {
     "email": "./dist/source/index.js"

package/source/commands/export.ts

@@ -21,7 +21,7 @@ export const exportTemplates = async (
   options: Options,
 ) => {
   const spinner = ora('Preparing files...\n').start();
-  closeOraOnSIGNIT(spinner)
+  closeOraOnSIGNIT(spinner);
 
   const allTemplates = glob.sync(normalize(path.join(srcDir, '*.{tsx,jsx}')));
 
@@ -32,12 +32,15 @@ export const exportTemplates = async (
     write: true,
     outdir: outDir,
   });
+  spinner.succeed();
 
   const allBuiltTemplates = glob.sync(normalize(`${outDir}/*.js`), {
     absolute: true,
   });
 
   for (const template of allBuiltTemplates) {
+    spinner.text = `rendering ${template.split('/').pop()}`;
+    spinner.render();
     const component = await import(template);
     const rendered = render(component.default({}), options);
     const htmlPath = template.replace(
@@ -47,6 +50,9 @@ export const exportTemplates = async (
     writeFileSync(htmlPath, rendered);
     unlinkSync(template);
   }
+  spinner.succeed('Rendered all files');
+  spinner.text = `Copying static files`;
+  spinner.render();
 
   const staticDir = path.join(srcDir, 'static');
   const hasStaticDirectory = fs.existsSync(staticDir);
@@ -59,6 +65,7 @@ export const exportTemplates = async (
       );
     }
   }
+  spinner.succeed();
 
   const fileTree = tree(outDir, {
     allFiles: true,

package/source/utils/close-ora-on-sigint.ts

@@ -1,7 +1,7 @@
-import { Ora } from 'ora'
+import { Ora } from 'ora';
 
 export const closeOraOnSIGNIT = (spinner: Ora) => {
   process.on('SIGINT', function () {
-    spinner.stop()
+    spinner.stop();
   });
-}
+};

package/source/utils/generate-email-preview.ts

@@ -12,6 +12,13 @@ import fse from 'fs-extra';
 import glob from 'glob';
 import { closeOraOnSIGNIT } from './close-ora-on-sigint';
 
+/**
+ * Node.js and imports are requiring all imports to be /, while some functions (like glob) return paths with \ for path separation on windows
+ */
+function osIndependentPath(p: string) {
+  return p.split(path.sep).join("/")
+}
+
 export const generateEmailsPreview = async (
   emailDir: string,
   type: 'all' | 'static' | 'templates' = 'all',
@@ -43,7 +50,7 @@ const createEmailPreviews = async (emailDir: string) => {
     await fs.promises.rm(PACKAGE_EMAILS_PATH, { recursive: true });
   }
 
-  const list = glob.sync(path.join(emailDir, '/*.{jsx,tsx}'), {
+  const list = glob.sync(osIndependentPath(path.join(emailDir, '/*.{jsx,tsx}')), {
     absolute: true,
   });
 
@@ -54,18 +61,19 @@ const createEmailPreviews = async (emailDir: string) => {
    * import Mail from '../../path/to/emails/my-template.tsx`
    * export default Mail
    */
-  for (const absoluteSrcFilePath of list) {
+  for (const _absoluteSrcFilePath of list) {
+    const absoluteSrcFilePath = osIndependentPath(_absoluteSrcFilePath);
     const fileName = absoluteSrcFilePath.split('/').pop()!;
     const targetFile = path.join(
-      PACKAGE_EMAILS_PATH,
-      absoluteSrcFilePath.replace(emailDir, ''),
+      osIndependentPath(PACKAGE_EMAILS_PATH),
+      absoluteSrcFilePath.replace(osIndependentPath(emailDir), ''),
     );
     const importPath = path.relative(
       path.dirname(targetFile),
       path.dirname(absoluteSrcFilePath),
     );
 
-    const importFile = path.join(importPath, fileName);
+    const importFile = osIndependentPath(path.join(importPath, fileName));
 
     // if this import is changed, you also need to update `client/src/app/preview/[slug]/page.tsx`
     const sourceCode =

package/source/utils/install-dependencies.ts

@@ -9,7 +9,7 @@ export type PackageManager = 'yarn' | 'npm' | 'pnpm';
 
 export const installDependencies = async (packageManager: PackageManager) => {
   const spinner = ora('Installing dependencies...\n').start();
-  closeOraOnSIGNIT(spinner)
+  closeOraOnSIGNIT(spinner);
 
   shell.cd(path.join(REACT_EMAIL_ROOT));
   shell.exec(`${packageManager} install`);

package/source/utils/start-server-command.ts

@@ -29,26 +29,31 @@ export const buildProdServer = (packageManager: string) => {
 };
 
 // based on https://stackoverflow.com/a/14032965
-function exitHandler() {
-  if (processesToKill.length > 0) {
-    console.log('shutting down %d subprocesses', processesToKill.length);
-  }
-  processesToKill.forEach((p) => {
-    if (p.connected) {
-      p.kill();
+const exitHandler: (options?: { exit?: boolean }) => NodeJS.ExitListener =
+  (options) =>
+    (code) => {
+    if (processesToKill.length > 0) {
+      console.log('shutting down %d subprocesses', processesToKill.length);
     }
-  });
-}
+    processesToKill.forEach((p) => {
+      if (p.connected) {
+        p.kill();
+      }
+    });
+      if (options?.exit) {
+      shell.exit(code);
+    }
+  };
 
 // do something when app is closing
-process.on('exit', exitHandler);
+process.on('exit', exitHandler());
 
 // catches ctrl+c event
-process.on('SIGINT', exitHandler);
+process.on('SIGINT', exitHandler({ exit: true }));
 
 //  catches "kill pid" (for example: nodemon restart)
-process.on('SIGUSR1', exitHandler);
-process.on('SIGUSR2', exitHandler);
+process.on('SIGUSR1', exitHandler({ exit: true }));
+process.on('SIGUSR2', exitHandler({ exit: true }));
 
 // catches uncaught exceptions
-process.on('uncaughtException', exitHandler);
+process.on('uncaughtException', exitHandler({ exit: true }));

package/source/utils/watcher.ts

@@ -9,12 +9,22 @@ import {
 } from './constants';
 import { generateEmailsPreview } from './generate-email-preview';
 
-export const createWatcherInstance = (watchDir: string) =>
-  chokidar.watch(watchDir, {
+export const createWatcherInstance = (watchDir: string) => {
+  const watcher = chokidar.watch(watchDir, {
     ignoreInitial: true,
     cwd: watchDir.split(path.sep).slice(0, -1).join(path.sep),
     ignored: /(^|[\/\\])\../,
   });
+  
+  // Catches ctrl+c event
+  const exit = async () => {
+    await watcher.close();
+  }
+  process.on('SIGINT', exit);
+  process.on('uncaughtException', exit);
+  
+  return watcher;
+}
 
 export const watcher = (watcherInstance: FSWatcher, watchDir: string) => {
   watcherInstance.on('all', async (event, filename) => {