templates: use TS server file

integration/helpers/cf-template/remix.config.js

@@ -2,7 +2,7 @@
 module.exports = {
   devServerBroadcastDelay: 1000,
   ignoredRouteFiles: ["**/.*"],
-  server: "./server.js",
+  server: "./server.ts",
   serverConditions: ["worker"],
   serverDependenciesToBundle: "all",
   serverMainFields: ["browser", "module", "main"],

packages/remix-dev/__tests__/fixtures/cloudflare/remix.config.js

@@ -1,7 +1,7 @@
 /** @type {import('@remix-run/dev').AppConfig} */
 module.exports = {
   serverBuildTarget: "cloudflare-pages",
-  server: "./server.js",
+  server: "./server.ts",
   devServerBroadcastDelay: 1000,
   ignoredRouteFiles: ["**/.*"],
   // appDirectory: "app",

packages/remix-dev/__tests__/fixtures/cloudflare/server.js → packages/remix-dev/__tests__/fixtures/cloudflare/server.ts

@@ -1,12 +1,8 @@
 import { createPagesFunctionHandler } from "@remix-run/cloudflare-pages";
 import * as build from "@remix-run/dev/server-build";
 
-const handleRequest = createPagesFunctionHandler({
+export const onRequest = createPagesFunctionHandler({
   build,
-  mode: process.env.NODE_ENV,
   getLoadContext: (context) => context.env,
+  mode: process.env.NODE_ENV,
 });
-
-export function onRequest(context) {
-  return handleRequest(context);
-}

templates/arc/remix.config.js

@@ -2,7 +2,7 @@
 module.exports = {
   ignoredRouteFiles: ["**/.*"],
   publicPath: "/_static/build/",
-  server: "./server.js",
+  server: "./server.ts",
   serverBuildPath: "server/index.js",
   // appDirectory: "app",
   // assetsBuildDirectory: "public/build",

templates/cloudflare-pages/remix.config.js

@@ -2,7 +2,7 @@
 module.exports = {
   devServerBroadcastDelay: 1000,
   ignoredRouteFiles: ["**/.*"],
-  server: "./server.js",
+  server: "./server.ts",
   serverBuildPath: "functions/[[path]].js",
   serverConditions: ["worker"],
   serverDependenciesToBundle: "all",

templates/cloudflare-pages/server.js → templates/cloudflare-pages/server.ts

@@ -1,12 +1,8 @@
 import { createPagesFunctionHandler } from "@remix-run/cloudflare-pages";
 import * as build from "@remix-run/dev/server-build";
 
-const handleRequest = createPagesFunctionHandler({
+export const onRequest = createPagesFunctionHandler({
   build,
-  mode: process.env.NODE_ENV,
   getLoadContext: (context) => context.env,
+  mode: process.env.NODE_ENV,
 });
-
-export function onRequest(context) {
-  return handleRequest(context);
-}

templates/cloudflare-workers/remix.config.js

@@ -2,7 +2,7 @@
 module.exports = {
   devServerBroadcastDelay: 1000,
   ignoredRouteFiles: ["**/.*"],
-  server: "./server.js",
+  server: "./server.ts",
   serverConditions: ["worker"],
   serverDependenciesToBundle: "all",
   serverMainFields: ["browser", "module", "main"],

templates/express/package.json

@@ -24,6 +24,9 @@
   "devDependencies": {
     "@remix-run/dev": "*",
     "@remix-run/eslint-config": "*",
+    "@types/compression": "^1.7.2",
+    "@types/express": "^4.17.17",
+    "@types/morgan": "^1.9.4",
     "@types/react": "^18.0.25",
     "@types/react-dom": "^18.0.8",
     "dotenv": "^16.0.3",

templates/express/server.js → templates/express/server.ts

@@ -1,10 +1,8 @@
-const path = require("path");
-const express = require("express");
-const compression = require("compression");
-const morgan = require("morgan");
-const { createRequestHandler } = require("@remix-run/express");
-
-const BUILD_DIR = path.join(process.cwd(), "build");
+import path from "path";
+import express from "express";
+import compression from "compression";
+import morgan from "morgan";
+import { createRequestHandler } from "@remix-run/express";
 
 const app = express();
 
@@ -25,34 +23,33 @@ app.use(express.static("public", { maxAge: "1h" }));
 
 app.use(morgan("tiny"));
 
+const BUILD_DIR = path.join(process.cwd(), "build");
+const MODE = process.env.NODE_ENV;
 app.all(
   "*",
-  process.env.NODE_ENV === "development"
-    ? (req, res, next) => {
+  MODE === "production"
+    ? createRequestHandler({ build: require(BUILD_DIR), mode: MODE })
+    : (...args) => {
         purgeRequireCache();
 
         return createRequestHandler({
           build: require(BUILD_DIR),
-          mode: process.env.NODE_ENV,
-        })(req, res, next);
+          mode: MODE,
+        })(...args);
       }
-    : createRequestHandler({
-        build: require(BUILD_DIR),
-        mode: process.env.NODE_ENV,
-      })
 );
-const port = process.env.PORT || 3000;
 
+const port = process.env.PORT || 3000;
 app.listen(port, () => {
-  console.log(`Express server listening on port ${port}`);
+  console.log(`✅ Express server listening on port ${port}`);
 });
 
 function purgeRequireCache() {
   // purge require cache on requests for "server side HMR" this won't let
   // you have in-memory objects between requests in development,
   // alternatively you can set up nodemon/pm2-dev to restart the server on
-  // file changes, but then you'll have to reconnect to databases/etc on each
-  // change. We prefer the DX of this, so we've included it for you by default
+  // file changes, we prefer the DX of this though, so we've included it
+  // for you by default
   for (const key in require.cache) {
     if (key.startsWith(BUILD_DIR)) {
       delete require.cache[key];

templates/netlify/package.json

@@ -8,7 +8,7 @@
     "typecheck": "tsc"
   },
   "dependencies": {
-    "@netlify/functions": "^1.3.0",
+    "@netlify/functions": "^1.4.0",
     "@remix-run/netlify": "*",
     "@remix-run/node": "*",
     "@remix-run/react": "*",

templates/netlify/remix.config.js

@@ -3,7 +3,7 @@ module.exports = {
   ignoredRouteFiles: ["**/.*"],
   server:
     process.env.NETLIFY || process.env.NETLIFY_LOCAL
-      ? "./server.js"
+      ? "./server.ts"
       : undefined,
   serverBuildPath: ".netlify/functions-internal/server.js",
   // appDirectory: "app",

templates/netlify/server.ts

@@ -0,0 +1,7 @@
+import { createRequestHandler } from "@remix-run/netlify";
+import * as build from "@remix-run/dev/server-build";
+
+export const handler = createRequestHandler({
+  build,
+  mode: process.env.NODE_ENV,
+});

templates/vercel/remix.config.js

@@ -4,7 +4,7 @@ module.exports = {
   // When running locally in development mode, we use the built-in remix
   // server. This does not understand the vercel lambda module format,
   // so we default back to the standard build output.
-  server: process.env.NODE_ENV === "development" ? undefined : "./server.js",
+  server: process.env.NODE_ENV === "development" ? undefined : "./server.ts",
   serverBuildPath: "api/index.js",
   // appDirectory: "app",
   // assetsBuildDirectory: "public/build",