useverto/deploy

🛠️ CLI tool for deploying Sapper exported applications on Arweave

Verto Deploy

CLI tool for deploying Sapper exported applications on Arweave

About

This is a CLI tool for deploying Svelte applications written in Sapper on Arweave

This project needs help. It does work, but it probably needs some adjustments to work with any Sapper app. It is only tested with useverto/verto.

Installing

yarn add global @verto/deploy or npm i -g @verto/deploy

First steps

• Before deploying, make sure that you run sapper export --entry "your routes with spaces between them"
• Make sure you are deploying the __sapper__/export directory. It won't work with anything else.

Usage

vdeploy help

Shows the help menu

Deploy a folder

vdeploy deploy --dir <Sapper project directory to deploy> --keyfile <path toArweave keyfile>

This deploys your Sapper project. What it does:

• Fixes links and hrefs (so it works with the arweave transaction id subfolder)
• Deploys all your files
• Creates a path manifest that links all files together and adds routes

Get balance

vdeploy balance --keyfile <path toArweave keyfile>

Helper command: returns your arweave balance

Get transaction status

vdeploy status <id>

Helper command: returns the status of the given transaction ID

Why does this library exist?

The arweave-deploy CLI does not work with Sapper applications. The routes are invalid and the links/hrefs also don't work. verto-deploy was built specifically for deploying Sapper apps.

deploy's Issues

Rewrite JS replace to detect the "goto" function

Right now the references.ts JS replacer adds "/"+window.location.href.split('/')[3]+ before all route strings. This can cause unwanted behavior.

A solution to this could be to smart-detect the actual goto function located in the client.<randomid>.js file and modify it to auto add "/"+window.location.href.split('/')[3]+ before all redirects.

This is not priority, and should be addressed in v2

Solve node throwing errors when using the root command

When using the vdeploy command, the console throws an error and says that the command is not found.

bash: verto: command not found

Images/other sources don't load

Images (for e.g. the Verto logo in the Verto app navbar) don't load.

The reason: srcs in js files are not being replaced yet in references.ts

Service worker error on deployment

After deploying an application, the console prints the following error:

Uncaught (in promise) TypeError: Failed to register a ServiceWorker for scope ('<ARWEAVE TRANSACTION URL>') with script ('<ARWEAVE TRANSACTION URL>'/service-worker.js'): ServiceWorker script evaluation failed

The reason of this error is that deploy does not replace the locations of the files the service worker is should save for offline usage.

This is the service-worker.js after deployment:

! function() {
    "use strict";
    const e = 1601215697236,
        t = "cache" + e,
        n = ["/client/api-client.2fc2fd4b.js", "/client/SkeletonLoading.867ca6a5.js", "/client/gallery.29f797af.js", "/client/constants.11c8703b.js", "/client/Button.b532723c.js", "/client/Loading.28bebe3e.js", "/client/gallery.f1b01f29.js", "/client/Footer.deac269b.js", "/client/tokens.a040c400.js", "/client/community.c1c1c3f4.js", "/client/latestTransactions.5f7e381f.js", "/client/tokens.42a1970d.js", "/client/index.76d56fe2.js", "/client/postTokens.ac56ac89.js", "/client/exchanges.006128df.js", "/client/login.ec0e357b.js", "/client/gate.3dfc4211.js", "/client/404.d037e017.js", "/client/index.096f2e6b.js", "/client/client.eff51e72.js", "/client/bignumber.dd54f2db.js", "/client/all-transactions.36ad57d0.js", "/client/all-exchanges.8e92fe18.js", "/client/post.bbe84225.js", "/client/keyfileStore.9cc765a0.js", "/client/trade.d5f0e953.js", "/client/moment.71d0ab0e.js", "/client/app.490f9dc7.js"].concat(["/" + window.location.href.split('/')[3] + "/service\-worker\-index\.html", "/down-arrow.svg", "/global.css", "/logo_dark.svg", "/logo_light.svg", "/og.png"]),
        s = new Set(n);
    self.addEventListener("install", e => {
        e.waitUntil(caches.open(t).then(e => e.addAll(n)).then(() => {
            self.skipWaiting()
        }))
    }), self.addEventListener("activate", e => {
        e.waitUntil(caches.keys().then(async e => {
            for (const n of e) n !== t && await caches.delete(n);
            self.clients.claim()
        }))
    }), self.addEventListener("fetch", t => {
        if ("GET" !== t.request.method || t.request.headers.has("range")) return;
        const n = new URL(t.request.url);
        n.protocol.startsWith("http") && (n.hostname === self.location.hostname && n.port !== self.location.port || (n.host === self.location.host && s.has(n.pathname) ? t.respondWith(caches.match(t.request)) : "only-if-cached" !== t.request.cache && t.respondWith(caches.open("offline" + e).then(async e => {
            try {
                const n = await fetch(t.request);
                return e.put(t.request, n.clone()), n
            } catch (n) {
                const s = await e.match(t.request);
                if (s) return s;
                throw n
            }
        }))))
    })
}();