add rollup config for server build

Author: excessivecoding

package.json

@@ -19,12 +19,13 @@
   },
   "scripts": {
     "dev": "vite build --watch",
-    "build": "tsc && vite build"
+    "build": "tsc && vite build && rollup -c"
   },
   "devDependencies": {
     "@remix-run/dev": "^1.0.5",
     "@remix-run/node": "^1.1.3",
     "@remix-run/react": "^1.0.5",
+    "@rollup/plugin-typescript": "^8.3.0",
     "@types/babel__core": "^7.1.18",
     "@types/node": "^17.0.14",
     "@types/node-fetch": "^2.6.1",
@@ -37,6 +38,7 @@
     "react": ">=16.8",
     "react-dom": ">=16.8",
     "remix": ">=1.0.5",
+    "rollup": "^2.67.2",
     "tailwindcss": "^3.0.18",
     "typescript": "^4.4.4",
     "vite": "^2.7.2"
@@ -47,6 +49,7 @@
     "remix": ">=1.0.5"
   },
   "dependencies": {
+    "axios": "^0.26.0",
     "highlight.js": "^11.4.0",
     "node-fetch": "^3.2.0",
     "source-map": "^0.7.3"

pnpm-lock.yaml

@@ -0,0 +1,37 @@
+import typescript from "@rollup/plugin-typescript";
+
+export default {
+  input: "src/server/index.ts",
+  plugins: [typescript()],
+  external: [
+    "react",
+    "react-dom",
+    "remix",
+    "source-map",
+    "fs/promises",
+    "axios",
+  ],
+  output: [
+    {
+      file: "dist/server/remix-crash.umd.js",
+      name: "RemixCrash",
+      format: "umd",
+      globals: {
+        remix: "Remix",
+        "source-map": "SourceMap",
+        "fs/promises": "FSPromises",
+        axios: "Axios",
+      },
+    },
+    {
+      file: "dist/server/remix-crash.es.js",
+      format: "esm",
+      globals: {
+        remix: "Remix",
+        "source-map": "SourceMap",
+        "fs/promises": "FSPromises",
+        axios: "Axios",
+      },
+    },
+  ],
+};

rollup.config.js

@@ -2,7 +2,7 @@ import { ActionFunction, LoaderFunction, json } from "remix";
 import { SourceMapConsumer } from "source-map";
 import { CORSResponse } from "./utils";
 import { readFile } from "fs/promises";
-// import fetch from "node-fetch";
+import axios from "axios";
 
 export const loader: LoaderFunction = () => {
   if (process.env.NODE_ENV !== "development") {
@@ -17,9 +17,9 @@ export const action: ActionFunction = async ({ request }) => {
     throw new Response(null, { status: 404 });
   }
 
-  // fetch("https://jsonplaceholder.typicode.com/todos/1")
-  //   .then((response) => response.json())
-  //   .then((json) => console.log(json));
+  axios("https://jsonplaceholder.typicode.com/todos/1")
+    .then((response) => response.data)
+    .then((data) => console.log(data));
 
   const url = new URL(request.url);
   const root = process.cwd();

src/server/endpoints.ts

@@ -12,9 +12,9 @@ export default defineConfig(({ mode }) => {
         : {},
     build: {
       emptyOutDir: false,
-      outDir: "dist/server",
+      outDir: "dist/client",
       lib: {
-        entry: path.resolve(__dirname, "src/server/index.ts"),
+        entry: path.resolve(__dirname, "src/client/index.ts"),
         name: "RemixCrash",
         fileName: (format) => `remix-crash.${format}.js`,
       },
@@ -27,7 +27,7 @@ export default defineConfig(({ mode }) => {
           "remix",
           "source-map",
           "fs/promises",
-          "node-fetch",
+          "axios",
         ],
         output: {
           // Provide global variables to use in the UMD build
@@ -38,7 +38,7 @@ export default defineConfig(({ mode }) => {
             remix: "Remix",
             "source-map": "SourceMap",
             "fs/promises": "FSPromises",
-            "node-fetch": "NodeFetch",
+            axios: "Axios",
           },
         },
       },