react-email 2.1.7-canary.2 → 2.2.0-alpha-2f5a07ff-20240814

package/build-preview-server.mjs

@@ -0,0 +1,24 @@
+import { spawn } from 'node:child_process';
+import { existsSync, promises as fs } from 'node:fs';
+
+const nextBuildProcess = spawn('next', ['build'], {
+  detached: true,
+  stdio: "inherit"
+});
+
+process.on('SIGINT', () => {
+  nextBuildProcess.kill('SIGINT');
+});
+
+nextBuildProcess.on('exit', async (code) => {
+  if (code !== 0) {
+    process.exit(code);
+  }
+
+  if (existsSync('dist/preview')) {
+    await fs.rm('dist/preview', { recursive: true });
+  }
+  await fs.mkdir('dist/preview', { recursive: true });
+  await fs.rename('.next', 'dist/preview/.next');
+});
+

package/{cli → dist/cli}/index.js

@@ -340,14 +340,14 @@ var import_commander = require("commander");
 // package.json
 var package_default = {
     name: "react-email",
-    version: "2.1.7-canary.2",
+    version: "2.2.0-alpha-2f5a07ff-20240814",
     description: "A live preview of your emails right in your browser.",
     bin: {
-        email: "./cli/index.js"
+        email: "./dist/cli/index.js"
     },
     scripts: {
-        build: "tsup",
-        dev: "tsup --watch",
+        build: "tsup-node && node build-preview-server.mjs",
+        dev: "tsup-node --watch",
         test: "vitest run",
         "test:watch": "vitest",
         clean: "rm -rf dist",
@@ -369,57 +369,57 @@ var package_default = {
     dependencies: {
         "@babel/core": "7.24.5",
         "@babel/parser": "7.24.5",
+        chalk: "4.1.2",
+        chokidar: "3.6.0",
+        commander: "11.1.0",
+        debounce: "2.0.0",
+        esbuild: "0.19.11",
+        glob: "10.3.4",
+        "log-symbols": "4.1.0",
+        "mime-types": "2.1.35",
+        "normalize-path": "3.0.0",
+        ora: "5.4.1",
+        "socket.io": "4.7.5"
+    },
+    devDependencies: {
         "@radix-ui/colors": "1.0.1",
         "@radix-ui/react-collapsible": "1.1.0",
         "@radix-ui/react-popover": "1.1.1",
         "@radix-ui/react-slot": "1.1.0",
         "@radix-ui/react-toggle-group": "1.1.0",
         "@radix-ui/react-tooltip": "1.1.1",
-        "@swc/core": "1.3.101",
+        "@react-email/render": "0.0.18-canary.0",
+        "@swc/core": "1.4.15",
+        "@types/babel__core": "7.20.5",
+        "@types/fs-extra": "11.0.1",
+        "@types/mime-types": "2.1.4",
+        "@types/node": "18.0.0",
+        "@types/normalize-path": "3.0.2",
         "@types/react": "^18.2.0",
         "@types/react-dom": "^18.2.0",
         "@types/webpack": "5.28.5",
+        "@vercel/style-guide": "5.1.0",
         autoprefixer: "10.4.14",
-        chalk: "4.1.2",
-        chokidar: "3.5.3",
         clsx: "2.1.0",
-        commander: "11.1.0",
-        debounce: "2.0.0",
-        esbuild: "0.19.11",
+        eslint: "8.50.0",
         "eslint-config-prettier": "9.0.0",
         "eslint-config-turbo": "1.10.12",
         "framer-motion": "12.0.0-alpha.0",
-        glob: "10.3.4",
-        "log-symbols": "4.1.0",
-        "mime-types": "2.1.35",
         next: "14.2.3",
-        "normalize-path": "3.0.0",
-        ora: "5.4.1",
-        postcss: "8.4.39",
+        postcss: "8.4.40",
         "prism-react-renderer": "2.1.0",
         react: "18.3.1",
         "react-dom": "18.3.1",
-        "socket.io": "4.7.5",
+        sharp: "0.33.3",
         "socket.io-client": "4.7.5",
         sonner: "1.3.1",
         "source-map-js": "1.0.2",
         "stacktrace-parser": "0.1.10",
         "tailwind-merge": "2.2.0",
         tailwindcss: "3.4.0",
-        typescript: "5.1.6"
-    },
-    devDependencies: {
-        "@react-email/components": "workspace:*",
-        "@react-email/render": "workspace:*",
-        "@types/babel__core": "7.20.5",
-        "@types/fs-extra": "11.0.1",
-        "@types/mime-types": "2.1.4",
-        "@types/node": "18.0.0",
-        "@types/normalize-path": "3.0.2",
-        "@vercel/style-guide": "5.1.0",
-        eslint: "8.50.0",
         tsup: "7.2.0",
         tsx: "4.9.0",
+        typescript: "5.1.6",
         vitest: "1.1.3"
     }
 };
@@ -628,11 +628,17 @@ var import_next = __toESM(require("next"));
 var import_ora = __toESM(require("ora"));
 var import_log_symbols = __toESM(require("log-symbols"));
 var import_chalk = __toESM(require("chalk"));
-// src/cli/utils/close-ora-on-sigint.ts
-var closeOraOnSIGNIT = function(spinner) {
-    process.on("SIGINT", function() {
-        spinner.stop();
+// src/utils/close-ora-on-sigint.ts
+var spinners = /* @__PURE__ */ new Set();
+process.on("SIGINT", function() {
+    spinners.forEach(function(spinner) {
+        if (spinner.isSpinning) {
+            spinner.stop();
+        }
     });
+});
+var closeOraOnSIGNIT = function(spinner) {
+    spinners.add(spinner);
 };
 // src/cli/utils/preview/serve-static-file.ts
 var import_node_path2 = __toESM(require("path"));
@@ -701,12 +707,11 @@ var serveStaticFile = function() {
 }();
 // src/cli/utils/preview/get-env-variables-for-preview-app.ts
 var import_path = __toESM(require("path"));
-var getEnvVariablesForPreviewApp = function(relativePathToEmailsDirectory, cliPackageLocation, cwd) {
+var getEnvVariablesForPreviewApp = function(relativePathToEmailsDirectory, cwd) {
     return {
-        NEXT_PUBLIC_EMAILS_DIR_RELATIVE_PATH: relativePathToEmailsDirectory,
-        NEXT_PUBLIC_CLI_PACKAGE_LOCATION: cliPackageLocation,
-        NEXT_PUBLIC_OS_PATH_SEPARATOR: import_path.default.sep,
-        NEXT_PUBLIC_USER_PROJECT_LOCATION: cwd
+        EMAILS_DIR_RELATIVE_PATH: relativePathToEmailsDirectory,
+        EMAILS_DIR_ABSOLUTE_PATH: import_path.default.resolve(cwd, relativePathToEmailsDirectory),
+        USER_PROJECT_LOCATION: cwd
     };
 };
 // src/cli/utils/preview/start-dev-server.ts
@@ -727,8 +732,9 @@ var safeAsyncServerListen = function(server, port) {
         });
     });
 };
-var isRunningBuilt = __filename.endsWith(import_node_path3.default.join("cli", "index.js"));
-var cliPacakgeLocation = isRunningBuilt ? import_node_path3.default.resolve(__dirname, "..") : import_node_path3.default.resolve(__dirname, "../../../..");
+var isDev = !__filename.endsWith(import_node_path3.default.join("cli", "index.js"));
+var cliPacakgeLocation = isDev ? import_node_path3.default.resolve(__dirname, "../../../..") : import_node_path3.default.resolve(__dirname, "../..");
+var previewServerLocation = isDev ? import_node_path3.default.resolve(__dirname, "../../../..") : import_node_path3.default.resolve(__dirname, "../preview");
 var startDevServer = function() {
     var _ref = _async_to_generator(function(emailsDirRelativePath, staticBaseDirRelativePath, port) {
         var portAlreadyInUse, nextPortToTry, spinner, timeBeforeNextReady, app, isNextReady, nextReadyPromise, nextHandleRequest, secondsToNextReady;
@@ -804,13 +810,13 @@ var startDevServer = function() {
                     closeOraOnSIGNIT(spinner);
                     timeBeforeNextReady = performance.now();
                     process.env = _object_spread({}, process.env, getEnvVariablesForPreviewApp(// If we don't do normalization here, stuff like https://github.com/resend/react-email/issues/1354 happens.
-                    import_node_path3.default.normalize(emailsDirRelativePath), cliPacakgeLocation, process.cwd()));
+                    import_node_path3.default.normalize(emailsDirRelativePath), process.cwd()));
                     app = (0, import_next.default)({
                         // passing in env here does not get the environment variables there
-                        dev: true,
+                        dev: isDev,
                         hostname: "localhost",
                         port: port,
-                        dir: cliPacakgeLocation
+                        dir: previewServerLocation
                     });
                     isNextReady = false;
                     nextReadyPromise = app.prepare();
@@ -1074,7 +1080,7 @@ var createDependencyGraph = function() {
                                                     var pathWithExtension = checkFileExtensionsUntilItExists("".concat(pathToSubDirectory, "/index"));
                                                     if (pathWithExtension) {
                                                         pathToDependencyFromDirectory = pathWithExtension;
-                                                    } else if (!isRunningBuilt) {
+                                                    } else if (isDev) {
                                                         console.warn("Could not find index file for directory at ".concat(pathToDependencyFromDirectory, ". This is probably going to cause issues with both hot reloading and your code."));
                                                     }
                                                 }
@@ -1082,7 +1088,7 @@ var createDependencyGraph = function() {
                                                     var pathWithExtension1 = checkFileExtensionsUntilItExists(pathToDependencyFromDirectory);
                                                     if (pathWithExtension1) {
                                                         pathToDependencyFromDirectory = pathWithExtension1;
-                                                    } else if (!isRunningBuilt) {
+                                                    } else if (isDev) {
                                                         console.warn("Could not determine the file extension for the file at ".concat(pathWithExtension1));
                                                     }
                                                 }
@@ -1643,11 +1649,9 @@ var setupHotreloading = function() {
                         _state.sent(),
                         3
                     ]), dependencyGraph = _ref[0], updateDependencyGraph = _ref[1], resolveDependentsOf = _ref[2].resolveDependentsOf;
-                    watcher = (0, import_chokidar.watch)(emailDirRelativePath, {
+                    watcher = (0, import_chokidar.watch)("", {
                         ignoreInitial: true,
-                        cwd: process.cwd(),
-                        // eslint-disable-next-line prefer-named-capture-group
-                        ignored: /(^|[/\\])\../
+                        cwd: absolutePathToEmailsDirectory
                     });
                     getFilesOutsideEmailsDirectory = function() {
                         return Object.keys(dependencyGraph).filter(function(p) {
@@ -1897,23 +1901,20 @@ var mergeDirectoriesWithSubDirectories = function(emailsDirectoryMetadata) {
     var currentResultingMergedDirectory = emailsDirectoryMetadata;
     while(currentResultingMergedDirectory.emailFilenames.length === 0 && currentResultingMergedDirectory.subDirectories.length === 1){
         var onlySubDirectory = currentResultingMergedDirectory.subDirectories[0];
-        currentResultingMergedDirectory = {
-            subDirectories: onlySubDirectory.subDirectories,
-            emailFilenames: onlySubDirectory.emailFilenames,
-            absolutePath: onlySubDirectory.absolutePath,
+        currentResultingMergedDirectory = _object_spread_props(_object_spread({}, onlySubDirectory), {
             directoryName: import_node_path6.default.join(currentResultingMergedDirectory.directoryName, onlySubDirectory.directoryName)
-        };
+        });
     }
     return currentResultingMergedDirectory;
 };
 var getEmailsDirectoryMetadata = function() {
     var _ref = _async_to_generator(function(absolutePathToEmailsDirectory) {
-        var keepFileExtensions, isSubDirectory, dirents, emailFilenames, subDirectories, emailsMetadata;
+        var keepFileExtensions, isSubDirectory, baseDirectoryPath, dirents, emailFilenames, subDirectories, emailsMetadata;
         var _arguments = arguments;
         return _ts_generator(this, function(_state) {
             switch(_state.label){
                 case 0:
-                    keepFileExtensions = _arguments.length > 1 && _arguments[1] !== void 0 ? _arguments[1] : false, isSubDirectory = _arguments.length > 2 && _arguments[2] !== void 0 ? _arguments[2] : false;
+                    keepFileExtensions = _arguments.length > 1 && _arguments[1] !== void 0 ? _arguments[1] : false, isSubDirectory = _arguments.length > 2 && _arguments[2] !== void 0 ? _arguments[2] : false, baseDirectoryPath = _arguments.length > 3 && _arguments[3] !== void 0 ? _arguments[3] : absolutePathToEmailsDirectory;
                     if (!import_node_fs5.default.existsSync(absolutePathToEmailsDirectory)) return [
                         2
                     ];
@@ -1935,13 +1936,15 @@ var getEmailsDirectoryMetadata = function() {
                         Promise.all(dirents.filter(function(dirent) {
                             return dirent.isDirectory() && !dirent.name.startsWith("_") && dirent.name !== "static";
                         }).map(function(dirent) {
-                            return getEmailsDirectoryMetadata(import_node_path6.default.join(absolutePathToEmailsDirectory, dirent.name), keepFileExtensions, true);
+                            var direntAbsolutePath = import_node_path6.default.join(absolutePathToEmailsDirectory, dirent.name);
+                            return getEmailsDirectoryMetadata(direntAbsolutePath, keepFileExtensions, true, baseDirectoryPath);
                         }))
                     ];
                 case 2:
                     subDirectories = _state.sent();
                     emailsMetadata = {
                         absolutePath: absolutePathToEmailsDirectory,
+                        relativePath: import_node_path6.default.relative(baseDirectoryPath, absolutePathToEmailsDirectory),
                         directoryName: absolutePathToEmailsDirectory.split(import_node_path6.default.sep).pop(),
                         emailFilenames: emailFilenames,
                         subDirectories: subDirectories
@@ -2064,7 +2067,7 @@ var getEmailTemplatesFromDirectory = function(emailDirectory) {
 };
 var exportTemplates = function() {
     var _ref = _async_to_generator(function(pathToWhereEmailMarkupShouldBeDumped, emailsDirectoryPath, options) {
-        var spinner, emailsDirectoryMetadata, allTemplates, exception, buildFailure, allBuiltTemplates, _iteratorNormalCompletion, _didIteratorError, _iteratorError, _iterator, _step, template, emailModule, rendered, htmlPath, exception1, err, staticDirectoryPath, pathToDumpStaticFilesInto, exception2, fileTree;
+        var spinner, emailsDirectoryMetadata, allTemplates, exception, buildFailure, allBuiltTemplates, _iteratorAbruptCompletion, _didIteratorError, _iteratorError, _iterator, _step, _value, template, emailModule, rendered, htmlPath, exception1, err, staticDirectoryPath, pathToDumpStaticFilesInto, exception2, fileTree;
         return _ts_generator(this, function(_state) {
             switch(_state.label){
                 case 0:
@@ -2151,30 +2154,36 @@ var exportTemplates = function() {
                     allBuiltTemplates = import_glob.glob.sync((0, import_normalize_path.default)("".concat(pathToWhereEmailMarkupShouldBeDumped, "/**/*.cjs")), {
                         absolute: true
                     });
-                    _iteratorNormalCompletion = true, _didIteratorError = false, _iteratorError = undefined;
+                    _iteratorAbruptCompletion = false, _didIteratorError = false;
                     _state.label = 6;
                 case 6:
                     _state.trys.push([
                         6,
-                        13,
                         14,
-                        15
+                        15,
+                        20
                     ]);
-                    _iterator = allBuiltTemplates[Symbol.iterator]();
+                    _iterator = _async_iterator(allBuiltTemplates);
                     _state.label = 7;
                 case 7:
-                    if (!!(_iteratorNormalCompletion = (_step = _iterator.next()).done)) return [
-                        3,
-                        12
+                    return [
+                        4,
+                        _iterator.next()
                     ];
-                    template = _step.value;
-                    _state.label = 8;
                 case 8:
+                    if (!(_iteratorAbruptCompletion = !(_step = _state.sent()).done)) return [
+                        3,
+                        13
+                    ];
+                    _value = _step.value;
+                    template = _value;
+                    _state.label = 9;
+                case 9:
                     _state.trys.push([
-                        8,
-                        10,
+                        9,
+                        11,
                         ,
-                        11
+                        12
                     ]);
                     if (spinner) {
                         spinner.text = "rendering ".concat(template.split("/").pop());
@@ -2186,16 +2195,16 @@ var exportTemplates = function() {
                         4,
                         emailModule.renderAsync(emailModule.reactEmailCreateReactElement(emailModule.default, {}), options)
                     ];
-                case 9:
+                case 10:
                     rendered = _state.sent();
                     htmlPath = template.replace(".cjs", options.plainText ? ".txt" : ".html");
                     (0, import_node_fs7.writeFileSync)(htmlPath, rendered);
                     (0, import_node_fs7.unlinkSync)(template);
                     return [
                         3,
-                        11
+                        12
                     ];
-                case 10:
+                case 11:
                     exception1 = _state.sent();
                     if (spinner) {
                         spinner.stopAndPersist({
@@ -2205,39 +2214,60 @@ var exportTemplates = function() {
                     }
                     console.error(exception1);
                     throw exception1;
-                case 11:
-                    _iteratorNormalCompletion = true;
+                case 12:
+                    _iteratorAbruptCompletion = false;
                     return [
                         3,
                         7
                     ];
-                case 12:
+                case 13:
                     return [
                         3,
-                        15
+                        20
                     ];
-                case 13:
+                case 14:
                     err = _state.sent();
                     _didIteratorError = true;
                     _iteratorError = err;
                     return [
                         3,
-                        15
+                        20
                     ];
-                case 14:
-                    try {
-                        if (!_iteratorNormalCompletion && _iterator.return != null) {
-                            _iterator.return();
-                        }
-                    } finally{
-                        if (_didIteratorError) {
-                            throw _iteratorError;
-                        }
+                case 15:
+                    _state.trys.push([
+                        15,
+                        ,
+                        18,
+                        19
+                    ]);
+                    if (!(_iteratorAbruptCompletion && _iterator.return != null)) return [
+                        3,
+                        17
+                    ];
+                    return [
+                        4,
+                        _iterator.return()
+                    ];
+                case 16:
+                    _state.sent();
+                    _state.label = 17;
+                case 17:
+                    return [
+                        3,
+                        19
+                    ];
+                case 18:
+                    if (_didIteratorError) {
+                        throw _iteratorError;
                     }
                     return [
                         7
                     ];
-                case 15:
+                case 19:
+                    return [
+                        7
+                    ];
+                case 20:
                     if (spinner) {
                         spinner.succeed("Rendered all files");
                         spinner.text = "Copying static files";
@@ -2246,12 +2276,12 @@ var exportTemplates = function() {
                     staticDirectoryPath = import_node_path8.default.join(emailsDirectoryPath, "static");
                     if (!import_node_fs7.default.existsSync(staticDirectoryPath)) return [
                         3,
-                        20
+                        25
                     ];
                     pathToDumpStaticFilesInto = import_node_path8.default.join(pathToWhereEmailMarkupShouldBeDumped, "static");
                     if (!import_node_fs7.default.existsSync(pathToDumpStaticFilesInto)) return [
                         3,
-                        17
+                        22
                     ];
                     return [
                         4,
@@ -2259,15 +2289,15 @@ var exportTemplates = function() {
                             recursive: true
                         })
                     ];
-                case 16:
+                case 21:
                     _state.sent();
-                    _state.label = 17;
-                case 17:
+                    _state.label = 22;
+                case 22:
                     _state.trys.push([
-                        17,
-                        19,
+                        22,
+                        24,
                         ,
-                        20
+                        25
                     ]);
                     return [
                         4,
@@ -2275,13 +2305,13 @@ var exportTemplates = function() {
                             recursive: true
                         })
                     ];
-                case 18:
+                case 23:
                     _state.sent();
                     return [
                         3,
-                        20
+                        25
                     ];
-                case 19:
+                case 24:
                     exception2 = _state.sent();
                     console.error(exception2);
                     if (spinner) {
@@ -2291,25 +2321,25 @@ var exportTemplates = function() {
                         });
                     }
                     throw new Error("Something went wrong while copying the file to ".concat(pathToWhereEmailMarkupShouldBeDumped, "/static, ").concat(exception2));
-                case 20:
+                case 25:
                     if (!(spinner && !options.silent)) return [
                         3,
-                        22
+                        27
                     ];
                     spinner.succeed();
                     return [
                         4,
                         tree(pathToWhereEmailMarkupShouldBeDumped, 4)
                     ];
-                case 21:
+                case 26:
                     fileTree = _state.sent();
                     console.log(fileTree);
                     spinner.stopAndPersist({
                         symbol: import_log_symbols2.default.success,
                         text: "Successfully exported emails"
                     });
-                    _state.label = 22;
-                case 22:
+                    _state.label = 27;
+                case 27:
                     return [
                         2
                     ];
@@ -2348,15 +2378,11 @@ var buildPreviewApp = function(absoluteDirectory) {
 };
 var setNextEnvironmentVariablesForBuild = function() {
     var _ref = _async_to_generator(function(emailsDirRelativePath, builtPreviewAppPath) {
-        var envVariables, nextConfigContents;
+        var nextConfigContents;
         return _ts_generator(this, function(_state) {
             switch(_state.label){
                 case 0:
-                    envVariables = _object_spread_props(_object_spread({}, getEnvVariablesForPreviewApp(// If we don't do normalization here, stuff like https://github.com/resend/react-email/issues/1354 happens.
-                    import_node_path9.default.normalize(emailsDirRelativePath), "PLACEHOLDER", "PLACEHOLDER")), {
-                        NEXT_PUBLIC_IS_BUILDING: "true"
-                    });
-                    nextConfigContents = "\nconst path = require('path');\n/** @type {import('next').NextConfig} */\nmodule.exports = {\n  env: {\n    ...".concat(JSON.stringify(envVariables), ",\n    NEXT_PUBLIC_USER_PROJECT_LOCATION: path.resolve(process.cwd(), '../'),\n    NEXT_PUBLIC_CLI_PACKAGE_LOCATION: process.cwd(),\n  },\n  // this is needed so that the code for building emails works properly\n  webpack: (\n    /** @type {import('webpack').Configuration & { externals: string[] }} */\n    config,\n    { isServer }\n  ) => {\n    if (isServer) {\n      config.externals.push('esbuild');\n    }\n\n    return config;\n  },\n  typescript: {\n    ignoreBuildErrors: true\n  },\n  eslint: {\n    ignoreDuringBuilds: true\n  },\n  experimental: {\n    webpackBuildWorker: true\n  },\n}");
+                    nextConfigContents = "\nconst path = require('path');\nconst emailsDirRelativePath = path.normalize('".concat(emailsDirRelativePath, "');\nconst userProjectLocation = path.resolve(process.cwd(), '../');\n/** @type {import('next').NextConfig} */\nmodule.exports = {\n  env: {\n    NEXT_PUBLIC_IS_BUILDING: 'true',\n    EMAILS_DIR_RELATIVE_PATH: emailsDirRelativePath,\n    EMAILS_DIR_ABSOLUTE_PATH: path.resolve(userProjectLocation, emailsDirRelativePath),\n    USER_PROJECT_LOCATION: userProjectLocation\n  },\n  // this is needed so that the code for building emails works properly\n  webpack: (\n    /** @type {import('webpack').Configuration & { externals: string[] }} */\n    config,\n    { isServer }\n  ) => {\n    if (isServer) {\n      config.externals.push('esbuild');\n    }\n\n    return config;\n  },\n  typescript: {\n    ignoreBuildErrors: true\n  },\n  eslint: {\n    ignoreDuringBuilds: true\n  },\n  experimental: {\n    webpackBuildWorker: true\n  },\n}");
                     return [
                         4,
                         import_node_fs8.default.promises.writeFile(import_node_path9.default.resolve(builtPreviewAppPath, "./next.config.js"), nextConfigContents, "utf8")
@@ -2389,7 +2415,7 @@ var getEmailSlugsFromEmailDirectory = function(emailDirectory, emailsDirectoryAb
 };
 var forceSSGForEmailPreviews = function() {
     var _ref = _async_to_generator(function(emailsDirPath, builtPreviewAppPath) {
-        var emailDirectoryMetadata, parameters;
+        var emailDirectoryMetadata, parameters, removeForceDynamic;
         return _ts_generator(this, function(_state) {
             switch(_state.label){
                 case 0:
@@ -2405,11 +2431,51 @@ var forceSSGForEmailPreviews = function() {
                             slug: slug
                         };
                     });
+                    removeForceDynamic = function() {
+                        var _ref = _async_to_generator(function(filePath) {
+                            var contents;
+                            return _ts_generator(this, function(_state) {
+                                switch(_state.label){
+                                    case 0:
+                                        return [
+                                            4,
+                                            import_node_fs8.default.promises.readFile(filePath, "utf8")
+                                        ];
+                                    case 1:
+                                        contents = _state.sent();
+                                        return [
+                                            4,
+                                            import_node_fs8.default.promises.writeFile(filePath, contents.replace("export const dynamic = 'force-dynamic';", ""), "utf8")
+                                        ];
+                                    case 2:
+                                        _state.sent();
+                                        return [
+                                            2
+                                        ];
+                                }
+                            });
+                        });
+                        return function removeForceDynamic(filePath) {
+                            return _ref.apply(this, arguments);
+                        };
+                    }();
                     return [
                         4,
-                        import_node_fs8.default.promises.appendFile(import_node_path9.default.resolve(builtPreviewAppPath, "./src/app/preview/[...slug]/page.tsx"), "\n\nexport function generateStaticParams() { \n  return Promise.resolve(\n    ".concat(JSON.stringify(parameters), "\n  );\n}"), "utf8")
+                        removeForceDynamic(import_node_path9.default.resolve(builtPreviewAppPath, "./src/app/layout.tsx"))
                     ];
                 case 2:
+                    _state.sent();
+                    return [
+                        4,
+                        removeForceDynamic(import_node_path9.default.resolve(builtPreviewAppPath, "./src/app/preview/[...slug]/page.tsx"))
+                    ];
+                case 3:
+                    _state.sent();
+                    return [
+                        4,
+                        import_node_fs8.default.promises.appendFile(import_node_path9.default.resolve(builtPreviewAppPath, "./src/app/preview/[...slug]/page.tsx"), "\n\nexport function generateStaticParams() { \n  return Promise.resolve(\n    ".concat(JSON.stringify(parameters), "\n  );\n}"), "utf8")
+                    ];
+                case 4:
                     _state.sent();
                     return [
                         2
@@ -2442,7 +2508,6 @@ var updatePackageJson = function() {
                     packageJson.name = "preview-server";
                     delete packageJson.devDependencies["@react-email/render"];
                     delete packageJson.devDependencies["@react-email/components"];
-                    packageJson.dependencies.sharp = "0.33.2";
                     return [
                         4,
                         import_node_fs8.default.promises.writeFile(packageJsonPath, JSON.stringify(packageJson), "utf8")
@@ -2471,7 +2536,7 @@ var npmInstall = function() {
                             childProc = (0, import_node_child_process.spawn)(packageManager, [
                                 "install",
                                 "--silent",
-                                "--force"
+                                "--include=dev"
                             ], {
                                 cwd: builtPreviewAppPath,
                                 shell: true
@@ -2650,10 +2715,14 @@ var start = function() {
                     "start"
                 ], {
                     cwd: builtPreviewPath,
-                    shell: true
+                    stdio: "inherit"
+                });
+                process.on("SIGINT", function() {
+                    nextStart.kill("SIGINT");
+                });
+                nextStart.on("exit", function(code) {
+                    process.exit(code !== null && code !== void 0 ? code : 0);
                 });
-                nextStart.stdout.pipe(process.stdout);
-                nextStart.stderr.pipe(process.stderr);
             } catch (error) {
                 console.log(error);
                 process.exit(1);