Modernize Deno template

.changeset/dirty-moose-search.md

@@ -0,0 +1,6 @@
+---
+"create-remix": minor
+---
+
+Adds Deno as a compatible package manager to install dependencies with.
+Furthermore `create-remix` will now detect if it is running under Deno and automatically use Deno as the package manager.

.changeset/loud-poems-buy.md

@@ -0,0 +1,5 @@
+---
+"@remix-run/node": patch
+---
+
+`installGlobals` is now a no-op when a Deno environment is detected.

.changeset/witty-cobras-float.md

@@ -0,0 +1,6 @@
+---
+"@remix-run/dev": minor
+---
+
+Added Deno project detection which is done by checking for the presence of a deno.json or deno.jsonc file.
+It is no longer a hard requirement to have a package.json file in the project. For a Deno project, dependencies can be added via the `deno add` command to a deno.json or deno.jsonc file instead.

.eslintignore

@@ -11,7 +11,6 @@ pnpm-lock.yaml
 # Deno
 integration/helpers/deno-template
 packages/remix-deno
-templates/deno
 
 packages/remix-dev/config/defaults
 templates/remix-tutorial/app/data.ts

.github/workflows/deployments.yml

@@ -171,11 +171,11 @@ jobs:
         working-directory: ./scripts/deployment-test
 
       - name: 🦕 Install Deno
-        uses: denoland/setup-deno@v1
+        uses: denoland/setup-deno@v2
         with:
-          deno-version: vx.x.x
+          deno-version: v2.x
       - name: 🦕 Deno Deploy CLI
-        run: deno install --allow-read --allow-write --allow-env --allow-net --allow-run --no-check -r -f https://deno.land/x/deploy/deployctl.ts
+        run: deno install -Arfg jsr:@deno/deployctl
 
       - name: 🚀 Deploy to Deno Deploy
         run: node ./deno-deploy.mjs

.github/workflows/format.yml

@@ -30,6 +30,11 @@ jobs:
           node-version-file: ".nvmrc"
           cache: "pnpm"
 
+      - name: 🦕 Install Deno
+        uses: denoland/setup-deno@v2
+        with:
+          deno-version: v2.x
+
       - name: 📥 Install deps
         run: pnpm install --frozen-lockfile
 
@@ -42,11 +47,6 @@ jobs:
       - name: 👔 Format
         run: pnpm format
 
-      - name: 🦕 Install Deno
-        uses: denoland/setup-deno@v1
-        with:
-          deno-version: vx.x.x
-
       - name: 👔 Format Deno files
         run: pnpm format:deno
 

.github/workflows/lint.yml

@@ -28,6 +28,11 @@ jobs:
           node-version-file: ".nvmrc"
           cache: "pnpm"
 
+      - name: 🦕 Install Deno
+        uses: denoland/setup-deno@v2
+        with:
+          deno-version: v2.x
+
       - name: Disable GitHub Actions Annotations
         run: |
           echo "::remove-matcher owner=tsc::"
@@ -40,10 +45,5 @@ jobs:
       - name: 🔬 Lint
         run: pnpm lint
 
-      - name: 🦕 Install Deno
-        uses: denoland/setup-deno@v1
-        with:
-          deno-version: vx.x.x
-
       - name: 🔬 Lint deno files
         run: pnpm lint:deno

.github/workflows/shared-test-integration.yml

@@ -46,6 +46,11 @@ jobs:
           node-version: ${{ matrix.node }}
           cache: "pnpm"
 
+      - name: 🦕 Install Deno
+        uses: denoland/setup-deno@v2
+        with:
+          deno-version: v2.x
+
       - name: Disable GitHub Actions Annotations
         run: |
           echo "::remove-matcher owner=tsc::"

.github/workflows/shared-test-unit.yml

@@ -38,6 +38,11 @@ jobs:
           node-version: ${{ matrix.node }}
           cache: "pnpm"
 
+      - name: 🦕 Install Deno
+        uses: denoland/setup-deno@v2
+        with:
+          deno-version: v2.x
+
       - name: Disable GitHub Actions Annotations
         run: |
           echo "::remove-matcher owner=tsc::"

.vscode/settings.json

@@ -1,5 +1,6 @@
 {
   "typescript.tsdk": "node_modules/typescript/lib",
-  "deno.enablePaths": ["./packages/remix-deno/"],
-  "deno.importMap": "./.vscode/deno_resolve_npm_imports.json"
+  "deno.config": "./templates/deno/deno.json",
+  "deno.enablePaths": ["./packages/remix-deno/", "./templates/deno"],
+  "deno.disablePaths": ["./templates/deno/app"]
 }

docs/guides/templates.md

@@ -34,14 +34,16 @@ npx create-remix@latest --template remix-run/remix/templates/express
 npx create-remix@latest --template remix-run/remix/templates/remix
 npx create-remix@latest --template remix-run/remix/templates/remix-javascript
 
+## Deno
+deno -A npm:create-remix@latest --template remix-run/remix/templates/deno
+
 ## SPA Mode
 npx create-remix@latest --template remix-run/remix/templates/spa
 
 ## Classic Remix Compiler
 npx create-remix@latest --template remix-run/remix/templates/classic-remix-compiler/arc
 npx create-remix@latest --template remix-run/remix/templates/classic-remix-compiler/cloudflare-pages
 npx create-remix@latest --template remix-run/remix/templates/classic-remix-compiler/cloudflare-workers
-npx create-remix@latest --template remix-run/remix/templates/classic-remix-compiler/deno
 npx create-remix@latest --template remix-run/remix/templates/classic-remix-compiler/express
 npx create-remix@latest --template remix-run/remix/templates/classic-remix-compiler/fly
 npx create-remix@latest --template remix-run/remix/templates/classic-remix-compiler/remix

integration/helpers/vite-deno-template/.gitignore

@@ -0,0 +1,3 @@
+node_modules
+/app/deno.d.ts
+/build

templates/classic-remix-compiler/deno/app/root.tsx → integration/helpers/vite-deno-template/app/root.tsx

@@ -1,18 +1,10 @@
-import { cssBundleHref } from "@remix-run/css-bundle";
-import type { LinksFunction } from "@remix-run/deno";
 import {
   Links,
-  LiveReload,
   Meta,
   Outlet,
   Scripts,
   ScrollRestoration,
 } from "@remix-run/react";
-import * as React from "react";
-
-export const links: LinksFunction = () => [
-  ...(cssBundleHref ? [{ rel: "stylesheet", href: cssBundleHref }] : []),
-];
 
 export default function App() {
   return (
@@ -27,7 +19,6 @@ export default function App() {
         <Outlet />
         <ScrollRestoration />
         <Scripts />
-        <LiveReload />
       </body>
     </html>
   );

templates/classic-remix-compiler/deno/app/routes/_index.tsx → integration/helpers/vite-deno-template/app/routes/_index.tsx

@@ -1,5 +1,4 @@
-import type { MetaFunction } from "@remix-run/deno";
-import * as React from "react";
+import type { MetaFunction } from "@remix-run/react";
 
 export const meta: MetaFunction = () => {
   return [

integration/helpers/vite-deno-template/deno.json

@@ -0,0 +1,5 @@
+{
+  "exclude": ["app/", "build/"],
+  "nodeModulesDir": "manual",
+  "unstable": ["kv"]
+}

integration/helpers/vite-deno-template/package.json

@@ -0,0 +1,46 @@
+{
+  "name": "integration-vite-deno-template",
+  "version": "0.0.0",
+  "private": true,
+  "scripts": {
+    "build": "deno run -A npm:@remix-run/dev vite:build",
+    "dev": "deno run -A npm:@remix-run/dev vite:dev",
+    "typecheck": "deno check '**/*' && deno run -A npm:typescript/tsc",
+    "typegen": "deno types > ./app/deno.d.ts"
+  },
+  "dependencies": {
+    "@remix-run/dev": "workspace:*",
+    "@remix-run/node": "workspace:*",
+    "@remix-run/react": "workspace:*",
+    "@remix-run/serve": "workspace:*",
+    "@remix-run/server-runtime": "workspace:*",
+    "isbot": "^4.1.0",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0"
+  },
+  "devDependencies": {
+    "@remix-run/dev": "workspace:*",
+    "@types/react": "^18.2.20",
+    "@types/react-dom": "^18.2.7",
+    "typescript": "^5.1.0",
+    "vite": "5.1.3",
+    "vite-tsconfig-paths": "^4.2.1"
+  },
+  "dependenciesMeta": {
+    "@remix-run/dev": {
+      "injected": true
+    },
+    "@remix-run/node": {
+      "injected": true
+    },
+    "@remix-run/react": {
+      "injected": true
+    },
+    "@remix-run/serve": {
+      "injected": true
+    },
+    "@remix-run/server-runtime": {
+      "injected": true
+    }
+  }
+}

integration/helpers/vite-deno-template/tsconfig.json

@@ -0,0 +1,32 @@
+{
+  "include": [
+    "app/**/*.ts",
+    "app/**/*.tsx",
+    "app/**/.server/**/*.ts",
+    "app/**/.server/**/*.tsx",
+    "app/**/.client/**/*.ts",
+    "app/**/.client/**/*.tsx"
+  ],
+  "compilerOptions": {
+    "lib": ["DOM", "DOM.Iterable", "ES2022"],
+    "types": ["vite/client"],
+    "isolatedModules": true,
+    "esModuleInterop": true,
+    "jsx": "react-jsx",
+    "module": "ESNext",
+    "moduleResolution": "Bundler",
+    "resolveJsonModule": true,
+    "target": "ES2022",
+    "strict": true,
+    "allowJs": true,
+    "skipLibCheck": true,
+    "forceConsistentCasingInFileNames": true,
+    "baseUrl": ".",
+    "paths": {
+      "~/*": ["./app/*"]
+    },
+
+    // Vite takes care of building everything, not tsc.
+    "noEmit": true
+  }
+}

integration/helpers/vite-deno-template/vite.config.mts

@@ -0,0 +1,7 @@
+import { vitePlugin as remix } from "@remix-run/dev";
+import { defineConfig } from "vite";
+import tsconfigPaths from "vite-tsconfig-paths";
+
+export default defineConfig({
+  plugins: [remix(), tsconfigPaths()],
+});