Merge pull request #189 from appwrite/fix-web-polyfills

fix(web): implement polyfills by default and not conditional

Author: eldadfux

src/SDK/Language/Web.php

@@ -60,6 +60,12 @@ public function getFiles()
                 'template'      => '/web/tsconfig.json.twig',
                 'minify'        => false,
             ],
+            [
+                'scope'         => 'default',
+                'destination'   => 'rollup.config.js',
+                'template'      => '/web/rollup.config.js.twig',
+                'minify'        => false,
+            ],
             [
                 'scope'         => 'default',
                 'destination'   => 'dist/cjs/package.json',

templates/web/package.json.twig

@@ -19,21 +19,21 @@
     "url": "{{ sdk.gitURL }}"
   },
   "scripts": {
-    "build": "npm run build:types && npm run build:esm && npm run build:cjs && npm run build:iife",
+    "build": "npm run build:types && npm run build:libs",
     "build:types": "tsc --declaration --emitDeclarationOnly --outDir types",
-    "build:esm": "tsc --module es6 --outDir dist/esm",
-    "build:cjs": "rollup dist/esm/sdk.js --format cjs --name Appwrite -e cross-fetch/polyfill --context global -m --no-esModule -o dist/cjs/sdk.js",
-    "build:iife": "rollup dist/esm/sdk.js --format iife --name Appwrite -e cross-fetch/polyfill --context window -m --no-esModule -o dist/iife/sdk.js"
+    "build:libs": "rollup -c"
   },
   "devDependencies": {
+    "@rollup/plugin-typescript": "^8.2.1",
     "playwright": "^1.10.0",
     "rollup": "^2.43.0",
     "serve-handler": "^6.1.3",
+    "tslib": "^2.2.0",
     "typescript": "^4.2.3"
   },
   "dependencies": {
     "cross-fetch": "^3.1.0",
-    "form-data": "^4.0.0"
+    "isomorphic-form-data": "^2.0.0"
   },
   "jsdelivr": "dist/iife/sdk.js",
   "unpkg": "dist/iife/sdk.js"

templates/web/rollup.config.js.twig

@@ -0,0 +1,31 @@
+import pkg from "./package.json";
+import typescript from "@rollup/plugin-typescript";
+
+export default {
+    external: Object.keys(pkg.dependencies),
+    input: "src/sdk.ts",
+    plugins: [typescript()],
+    output: [
+        {
+            format: "cjs",
+            file: pkg.main,
+            esModule: false,
+            sourcemap: true,
+        },
+        {
+            format: "es",
+            file: pkg.module,
+            sourcemap: true,
+        },
+        {
+            format: "iife",
+            file: pkg.jsdelivr,
+            name: "Appwrite",
+            esModule: false,
+            globals: {
+                "cross-fetch": "window",
+                "FormData": "FormData",
+            },
+        },
+    ],
+};

templates/web/src/sdk.ts.twig

@@ -1,3 +1,6 @@
+import "isomorphic-form-data";
+import { fetch } from "cross-fetch";
+
 type Payload = {
     [key: string]: any;
 }
@@ -6,9 +9,6 @@ type Headers = {
     [key: string]: string;
 }
 
-const FormData = typeof window === 'undefined' ? require('form-data') : window.FormData; 
-const fetch = typeof window === 'undefined' ? require('cross-fetch') : window.fetch; 
-
 class {{spec.title | caseUcfirst}}Exception extends Error {
     code: number;
     response: string;

templates/web/tsconfig.json.twig

@@ -6,7 +6,7 @@
         "declaration": false,
         "esModuleInterop": true,
         "inlineSourceMap": false,
-        "lib": ["ES6", "DOM"],
+        "lib": ["ESNext", "DOM"],
         "listEmittedFiles": false,
         "listFiles": false,
         "moduleResolution": "node",