Remove builds in favor of zero-config (vercel#87)

* Remove builds in favor of zero-config * Rename types from .d.ts to .ts and import * Fix types * Fix web build to use separate tsconfig.json * Rename web/browser.ts to web/index.ts * Move fonts
noahflk · Jul 25, 2019 · 8f60e21 · 8f60e21
1 parent 05a7c51
commit 8f60e21
Show file tree

Hide file tree

Showing 24 changed files with 48 additions and 42 deletions.
diff --git a/.gitignore b/.gitignore
@@ -1,2 +1,3 @@
 node_modules
-dist
+api/dist
+public/dist
diff --git a/.nowignore b/.nowignore
@@ -1,5 +1,6 @@
 node_modules
-dist
+api/dist
+public/dist
 CONTRIBUTING.md
 README.md
 Dockerfile
diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
@@ -2,8 +2,8 @@
 
 There are two pieces to `og-image` that are worth noting before you begin development.
 
-1. The backend image generator located in [/src/card.ts](https://github.com/zeit/og-image/blob/master/src/card.ts)
-2. The frontend inputs located in [/src/browser.ts](https://github.com/zeit/og-image/blob/master/src/browser.ts)
+1. The backend image generator located in [/api/index.ts](https://github.com/zeit/og-image/blob/master/api/index.ts)
+2. The frontend inputs located in [/web/index.ts](https://github.com/zeit/og-image/blob/master/web/index.ts)
 
 The Now 2.0 platform handles [routing](https://github.com/zeit/og-image/blob/master/now.json#L12) in an elegate way for us so deployment is easy.
 

diff --git a/README.md b/README.md
@@ -57,7 +57,7 @@ You'll want to fork this repository and deploy your own image generator.
 4. Make changes by swapping out images, changing colors, etc (see [contributing](https://github.com/zeit/og-image/blob/master/CONTRIBUTING.md) for more info)
 5. Run locally with `now dev` and visit [localhost:3000](http://localhost:3000)  (if nothing happens, run `npm install -g now`)
 6. Deploy to the cloud by running `now` and you'll get a unique URL
-7. Setup [GitHub](https://zeit.co/github) to autodeply on push and set an `alias` in [now.json](https://zeit.co/github) to customize your URL.
+7. Setup [GitHub](https://zeit.co/github) to autodeply on push and set an `alias` in [now.json](https://zeit.co/docs/v2/advanced/configuration) to customize your URL.
 
 Alternatively, you can do a one-click to deploy with the button below.
 

diff --git a/src/chromium.ts → api/chromium.ts b/src/chromium.ts → api/chromium.ts
@@ -1,5 +1,6 @@
 import { launch, Page } from 'puppeteer-core';
 import { getOptions } from './options';
+import { FileType } from './types';
 let _page: Page | null;
 
 async function getPage(isDev: boolean) {

diff --git a/src/file.ts → api/file.ts b/src/file.ts → api/file.ts
diff --git a/src/card.ts → api/index.ts b/src/card.ts → api/index.ts
diff --git a/src/options.ts → api/options.ts b/src/options.ts → api/options.ts
diff --git a/src/parser.ts → api/parser.ts b/src/parser.ts → api/parser.ts
@@ -1,5 +1,6 @@
 import { IncomingMessage } from 'http';
 import { parse } from 'url';
+import { ParsedRequest, Theme } from './types';
 
 export function parseRequest(req: IncomingMessage) {
     console.log('HTTP ' + req.url);

diff --git a/src/sanitizer.ts → api/sanitizer.ts b/src/sanitizer.ts → api/sanitizer.ts
diff --git a/src/template.ts → api/template.ts b/src/template.ts → api/template.ts
@@ -2,13 +2,14 @@
 import { readFileSync } from 'fs';
 import marked from 'marked';
 import { sanitizeHtml } from './sanitizer';
+import { ParsedRequest } from './types';
 const twemoji = require('twemoji');
 const twOptions = { folder: 'svg', ext: '.svg' };
 const emojify = (text: string) => twemoji.parse(text, twOptions);
 
-const regular = readFileSync(`${__dirname}/../.fonts/Inter-Regular.woff2`).toString('base64');
-const bold = readFileSync(`${__dirname}/../.fonts/Inter-Bold.woff2`).toString('base64');
-const mono = readFileSync(`${__dirname}/../.fonts/Vera-Mono.woff2`).toString('base64');
+const regular = readFileSync(`${__dirname}/../fonts/Inter-Regular.woff2`).toString('base64');
+const bold = readFileSync(`${__dirname}/../fonts/Inter-Bold.woff2`).toString('base64');
+const mono = readFileSync(`${__dirname}/../fonts/Vera-Mono.woff2`).toString('base64');
 
 function getCss(theme: string, fontSize: string) {
     let background = 'white';

diff --git a/tsconfig.json → api/tsconfig.json b/tsconfig.json → api/tsconfig.json
@@ -16,7 +16,7 @@
         "preserveConstEnums": true,
         "esModuleInterop": true
     },
-    "exclude": [
-        "node_modules"
+    "include": [
+        "./"
     ]
 }
diff --git a/src/types.d.ts → api/types.ts b/src/types.d.ts → api/types.ts
@@ -1,7 +1,7 @@
-type FileType = 'png' | 'jpeg';
-type Theme = 'light' | 'dark';
+export type FileType = 'png' | 'jpeg';
+export type Theme = 'light' | 'dark';
 
-interface ParsedRequest {
+export interface ParsedRequest {
     fileType: FileType;
     text: string;
     theme: Theme;

diff --git a/.fonts/Inter-Bold.woff2 → fonts/Inter-Bold.woff2 b/.fonts/Inter-Bold.woff2 → fonts/Inter-Bold.woff2
diff --git a/.fonts/Inter-License.txt → fonts/Inter-License.txt b/.fonts/Inter-License.txt → fonts/Inter-License.txt
diff --git a/.fonts/Inter-Regular.woff2 → fonts/Inter-Regular.woff2 b/.fonts/Inter-Regular.woff2 → fonts/Inter-Regular.woff2
diff --git a/.fonts/Vera-License.txt → fonts/Vera-License.txt b/.fonts/Vera-License.txt → fonts/Vera-License.txt
diff --git a/.fonts/Vera-Mono.woff2 → fonts/Vera-Mono.woff2 b/.fonts/Vera-Mono.woff2 → fonts/Vera-Mono.woff2
diff --git a/now.json b/now.json
@@ -4,15 +4,8 @@
     "version": 2,
     "regions": ["all"],
     "public": true,
-    "builds": [
-        { "src": "public/**", "use": "@now/static" },
-        { "src": "package.json", "use": "@now/static-build" },
-        { "src": "src/card.ts", "use": "@now/node@canary", "config": { "maxLambdaSize": "36mb" } }
-    ],
     "routes": [
-        { "src": "/", "dest": "/public/index.html" },
-        { "src": "/(favicon.ico|style.css|robots.txt)", "dest": "/public/$1" },
-        { "src": "/dist/browser.js", "dest": "/browser.js" },
-        { "src": "/(.+)", "dest": "/src/card.ts" }
+        { "handle": "filesystem" },
+        { "src": "/(.+)", "dest": "/api" }
     ]
 }
diff --git a/package.json b/package.json
@@ -2,25 +2,22 @@
   "name": "og-image",
   "version": "1.0.0",
   "description": "Generate an open graph image for twitter/facebook/etc",
-  "main": "dist/card.js",
   "engines": {
     "node": "8.10.x"
   },
   "scripts": {
-    "build": "tsc",
-    "now-build": "tsc",
-    "watch": "tsc --watch"
+    "build": "tsc -p api/tsconfig.json && tsc -p web/tsconfig.json"
   },
   "license": "MIT",
   "dependencies": {
     "chrome-aws-lambda": "1.11.1",
-    "marked": "0.6.1",
+    "marked": "0.7.0",
     "puppeteer-core": "1.11.0",
     "twemoji": "11.3.0"
   },
   "devDependencies": {
-    "@types/marked": "0.6.1",
+    "@types/marked": "0.6.5",
     "@types/puppeteer-core": "1.9.0",
-    "typescript": "3.3.3333"
+    "typescript": "3.5.3"
   }
 }
diff --git a/public/index.html b/public/index.html
@@ -36,7 +36,7 @@ <h2>What is this?</h2>
     </div>
     <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/dot-dom@0.3.0/dotdom.min.js"></script>
     <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/copee@1.0.6/dist/copee.umd.js"></script>
-    <script type="text/javascript" src="../dist/browser.js"></script>
+    <script type="text/javascript" src="dist/web/index.js"></script>
 </body>
 
 </html>
diff --git a/src/browser.ts → web/index.ts b/src/browser.ts → web/index.ts
@@ -1,3 +1,4 @@
+import { ParsedRequest, Theme, FileType } from '../api/types';
 const { H, R, copee } = (window as any);
 let timeout = -1;
 

diff --git a/web/tsconfig.json b/web/tsconfig.json
@@ -0,0 +1,10 @@
+{
+    "extends": "../api/tsconfig.json",
+    "compilerOptions": {
+        "module": "esnext",
+        "outDir": "../public/dist"
+    },
+    "include": [
+        "./"
+    ]
+}
diff --git a/yarn.lock b/yarn.lock
@@ -2,10 +2,10 @@
 # yarn lockfile v1
 
 
-"@types/marked@0.6.1":
-  version "0.6.1"
-  resolved "https://registry.yarnpkg.com/@types/marked/-/marked-0.6.1.tgz#4281d0fbdb7bbefb69905cf44558297bc3c446aa"
-  integrity sha512-yE2cXQELHabu4t+RJIrFu0dVZEG7+zr0cHDSlb8SOJbXiAss/bY9PvSubgaoG7dyn9Bb+GT2Xl4HVhChuU5mEQ==
+"@types/marked@0.6.5":
+  version "0.6.5"
+  resolved "https://registry.yarnpkg.com/@types/marked/-/marked-0.6.5.tgz#3cf2a56ef615dad24aaf99784ef90a9eba4e29d8"
+  integrity sha512-6kBKf64aVfx93UJrcyEZ+OBM5nGv4RLsI6sR1Ar34bpgvGVRoyTgpxn4ZmtxOM5aDTAaaznYuYUH8bUX3Nk3YA==
 
 "@types/node@*":
   version "11.10.4"
@@ -174,10 +174,10 @@ isarray@~1.0.0:
   resolved "https://registry.yarnpkg.com/isarray/-/isarray-1.0.0.tgz#bb935d48582cba168c06834957a54a3e07124f11"
   integrity sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE=
 
-marked@0.6.1:
-  version "0.6.1"
-  resolved "https://registry.yarnpkg.com/marked/-/marked-0.6.1.tgz#a63addde477bca9613028de4b2bc3629e53a0562"
-  integrity sha512-+H0L3ibcWhAZE02SKMqmvYsErLo4EAVJxu5h3bHBBDvvjeWXtl92rGUSBYHL2++5Y+RSNgl8dYOAXcYe7lp1fA==
+marked@0.7.0:
+  version "0.7.0"
+  resolved "https://registry.yarnpkg.com/marked/-/marked-0.7.0.tgz#b64201f051d271b1edc10a04d1ae9b74bb8e5c0e"
+  integrity sha512-c+yYdCZJQrsRjTPhUx7VKkApw9bwDkNbHUKo1ovgcfDjb2kc8rLuRbIFyXL5WOEUwzSSKo3IXpph2K6DqB/KZg==
 
 mime@^2.0.3:
   version "2.4.0"
@@ -301,10 +301,10 @@ typedarray@^0.0.6:
   resolved "https://registry.yarnpkg.com/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777"
   integrity sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=
 
-typescript@3.3.3333:
-  version "3.3.3333"
-  resolved "https://registry.yarnpkg.com/typescript/-/typescript-3.3.3333.tgz#171b2c5af66c59e9431199117a3bcadc66fdcfd6"
-  integrity sha512-JjSKsAfuHBE/fB2oZ8NxtRTk5iGcg6hkYXMnZ3Wc+b2RSqejEqTaem11mHASMnFilHrax3sLK0GDzcJrekZYLw==
+typescript@3.5.3:
+  version "3.5.3"
+  resolved "https://registry.yarnpkg.com/typescript/-/typescript-3.5.3.tgz#c830f657f93f1ea846819e929092f5fe5983e977"
+  integrity sha512-ACzBtm/PhXBDId6a6sDJfroT2pOWt/oOnk4/dElG5G33ZL776N3Y6/6bKZJBFpd+b05F3Ct9qDjMeJmRWtE2/g==
 
 util-deprecate@~1.0.1:
   version "1.0.2"