From d0f83ad959a1c91a3d8f489cdf23e3a92a7e5b6b Mon Sep 17 00:00:00 2001 From: Pedro Cattori Date: Thu, 19 May 2022 14:24:05 -0400 Subject: [PATCH 1/4] feat(templates/deno): deploy to deno deploy --- templates/deno/README.md | 47 ++++++++++++++++++++++++++++++++++++- templates/deno/package.json | 1 + 2 files changed, 47 insertions(+), 1 deletion(-) diff --git a/templates/deno/README.md b/templates/deno/README.md index a5e11fc3ee9..2d2e1342981 100644 --- a/templates/deno/README.md +++ b/templates/deno/README.md @@ -58,4 +58,49 @@ Building the Deno app (`npm run build`) results in two outputs: - `build/` (server bundle) - `public/build/` (browser bundle) -You can deploy these bundles to a host of your choice, just make sure it runs Deno! +You can deploy these bundles to any host that runs Deno, but here we'll focus on deploying to [Deno Deploy](https://deno.com/deploy). + +## Setting up Deno Deploy + +1. [Sign up](https://dash.deno.com/signin) for Deno Deploy. + +2. [Create a new Deno Deploy project](https://dash.deno.com/new) for this app. + +3. Replace `` in the `deploy` script in `package.json` with your Deno Deploy project name: + +```json +{ + "scripts": { + "deploy": "deployctl deploy --project= --include=.cache,build,public ./build/index.js" + } +} +``` + +4. [Create a personal access token](https://dash.deno.com/account) for the Deno Deploy API and export it as `DENO_DEPLOY_TOKEN`: + +```sh +export DENO_DEPLOY_TOKEN= +``` + +You may want to add this to your `rc` file (e.g. `.bashrc` or `.zshrc`) to make it available for new terminal sessions, but make sure you don't commit this token into `git`. +If you want to use this token in GitHub Actions, set it as a GitHub secret. + +5. Install the Deno Deploy CLI, [`deployctl`](https://github.com/denoland/deployctl): + +```sh +deno install --allow-read --allow-write --allow-env --allow-net --allow-run --no-check -r -f https://deno.land/x/deploy/deployctl.ts +``` + +6. If you have previously installed the Deno Deploy CLI, you should update it to the latest version: + +```sh +deployctl upgrade +``` + +### Deploying to Deno Deploy + +After you've set up Deno Deploy, run: + +```sh +npm run deploy +``` diff --git a/templates/deno/package.json b/templates/deno/package.json index 7c9e26b23c9..a86de20646b 100644 --- a/templates/deno/package.json +++ b/templates/deno/package.json @@ -4,6 +4,7 @@ "sideEffects": false, "scripts": { "build": "remix build", + "deploy": "deployctl deploy --prod --include=build,public --project= ./build/index.js", "dev": "remix build && run-p dev:*", "dev:deno": "cross-env NODE_ENV=development deno run --unstable --watch --allow-net --allow-read --allow-env ./build/index.js", "dev:remix": "remix watch", From d3002a7ec97d802d3399f56e13611b039f1af5de Mon Sep 17 00:00:00 2001 From: Pedro Cattori Date: Thu, 19 May 2022 14:25:07 -0400 Subject: [PATCH 2/4] feat(templates/deno): recommend the deno extension for vscode --- templates/deno/.vscode/extensions.json | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 templates/deno/.vscode/extensions.json diff --git a/templates/deno/.vscode/extensions.json b/templates/deno/.vscode/extensions.json new file mode 100644 index 00000000000..c4eb3fedc9e --- /dev/null +++ b/templates/deno/.vscode/extensions.json @@ -0,0 +1,5 @@ +{ + "recommendations": [ + "denoland.vscode-deno" + ] +} \ No newline at end of file From 39a1fa72ca25c086c574e902659a87442edb1fc7 Mon Sep 17 00:00:00 2001 From: Pedro Cattori Date: Thu, 19 May 2022 14:32:18 -0400 Subject: [PATCH 3/4] docs(templates/deno): explain how to setup type hints within editor --- templates/deno/README.md | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/templates/deno/README.md b/templates/deno/README.md index 2d2e1342981..1a6fe3d7e04 100644 --- a/templates/deno/README.md +++ b/templates/deno/README.md @@ -37,6 +37,14 @@ npm run dev This starts your app in development mode, rebuilding assets on file changes. +### Type hints + +This template provides type hinting to VS Code via a [dedicated import map](./.vscode/resolve_npm_imports.json). + +To get types in another editor, use an extension for Deno that supports import maps and point your editor to `./.vscode/resolve_npm_imports.json`. + +For more, see [our decision doc for interop between Deno and NPM](https://github.com/remix-run/remix/blob/main/decisions/0001-use-npm-to-manage-npm-dependencies-for-deno-projects.md#vs-code-type-hints). + ## Production First, build your app for production: From 99754281aaac228fd4fe1537cb9dba2d588cb57e Mon Sep 17 00:00:00 2001 From: Pedro Cattori Date: Thu, 19 May 2022 18:32:08 -0400 Subject: [PATCH 4/4] ci(deno-deploy): add deploy test for deno deploy --- .github/workflows/deployments.yml | 43 +++++++++++++++++++++ scripts/deployment-test/deno-deploy.mjs | 51 +++++++++++++++++++++++++ 2 files changed, 94 insertions(+) create mode 100644 scripts/deployment-test/deno-deploy.mjs diff --git a/.github/workflows/deployments.yml b/.github/workflows/deployments.yml index 32b1c8f4d6d..ac5595e6e40 100644 --- a/.github/workflows/deployments.yml +++ b/.github/workflows/deployments.yml @@ -116,6 +116,49 @@ jobs: CF_ACCOUNT_ID: ${{ secrets.TEST_CF_ACCOUNT_ID }} CF_API_TOKEN: ${{ secrets.TEST_CF_API_TOKEN }} + # "deploy deploy" is not a typo, we are deploying to Deno Deploy + deno_deploy_deploy: + name: "Deno Deploy Deploy" + if: github.repository == 'remix-run/remix' + runs-on: ubuntu-latest + steps: + - name: 🛑 Cancel Previous Runs + uses: styfle/cancel-workflow-action@0.9.1 + + - name: ⬇️ Checkout repo + uses: actions/checkout@v3 + + - name: ⎔ Setup node + uses: actions/setup-node@v3 + with: + node-version-file: ".nvmrc" + + # some deployment targets require the latest version of npm + # TODO: remove this eventually when the default version we get + # is "latest" enough. + - name: 📦 Install latest version of npm + run: npm install -g npm@latest + working-directory: ./scripts/deployment-test + + - name: 📥 Install deployment-test deps + uses: bahmutov/npm-install@v1 + with: + working-directory: ./scripts/deployment-test + useLockFile: false + + - name: 🦕 Install Deno + uses: denoland/setup-deno@v1 + with: + deno-version: vx.x.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 + + - name: 🚀 Deploy to Deno Deploy + run: node ./deno-deploy.mjs + working-directory: ./scripts/deployment-test + env: + DENO_DEPLOY_TOKEN: ${{ secrets.TEST_DENO_DEPLOY_TOKEN }} + fly_deploy: name: "Fly Deploy" if: github.repository == 'remix-run/remix' diff --git a/scripts/deployment-test/deno-deploy.mjs b/scripts/deployment-test/deno-deploy.mjs new file mode 100644 index 00000000000..adab9fa1fe1 --- /dev/null +++ b/scripts/deployment-test/deno-deploy.mjs @@ -0,0 +1,51 @@ +import { sync as spawnSync } from "cross-spawn"; +import { createApp } from "@remix-run/dev"; + +import { + getAppDirectory, + getAppName, + getSpawnOpts, + validatePackageVersions, +} from "./_shared.mjs"; + +let DENO_DEPLOY_PROJECT_NAME= "remix-deno-deploy-test" +let APP_NAME = getAppName(DENO_DEPLOY_PROJECT_NAME); +let PROJECT_DIR = getAppDirectory(APP_NAME); + +async function createNewApp() { + await createApp({ + appTemplate: "deno", + installDeps: false, + useTypeScript: true, + projectDir: PROJECT_DIR, + }); +} + +try { + // create a new remix app + await createNewApp(); + + // validate dependencies are available + await validatePackageVersions(PROJECT_DIR); + + let spawnOpts = getSpawnOpts(PROJECT_DIR); + + // install deps + spawnSync("npm", ["install"], spawnOpts); + spawnSync("npm", ["run", "build"], spawnOpts); + + // deploy to deno deploy + let deployCommand = spawnSync( + "deployctl", + ["deploy", "--prod", "--include=public,build", `--project=${DENO_DEPLOY_PROJECT_NAME}`, "./build/index.js"], + spawnOpts + ); + if (deployCommand.status !== 0) { + throw new Error("Deploying to Deno Deploy failed"); + } + + console.log(`Deployed to ${DENO_DEPLOY_PROJECT_NAME}.deno.dev`); +} catch (error) { + console.error(error); + process.exit(1); +} \ No newline at end of file