Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Better user logs & absolute paths #36

Open
wants to merge 4 commits into
base: main
Choose a base branch
from
Open

Better user logs & absolute paths #36

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
685cf7d
fix: all paths are absolute
mxdvl Apr 26, 2023
526a875
docs: more informative logs
mxdvl Apr 26, 2023
38eab1f
fix: correct favicon path
mxdvl Apr 26, 2023
c226cec
feat: pass base path to routes
mxdvl Apr 26, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions .github/workflows/deploy.yml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -47,7 +47,7 @@ jobs:
with:
project: mononykus
entrypoint: https://deno.land/[email protected]/http/file_server.ts
root: src/_site/build
root: build

gh:
if: github.ref_name == 'main'
Expand Down Expand Up @@ -80,7 +80,7 @@ jobs:
- name: Upload artifact
uses: actions/upload-pages-artifact@v1
with:
path: src/_site/build
path: build

- name: Deploy to GitHub Pages
id: deployment
Expand Down
11 changes: 10 additions & 1 deletion src/_site/routes/index.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,9 +3,18 @@
import HelloFriend from "../components/HelloFriend.island.svelte";
import Counter from "../components/Counter.island.svelte";
import Body from "../components/Body.svelte";

export let base_path = "/";
</script>

<svelte:head><title>Mononykus – Deno + Svelte</title></svelte:head>
<svelte:head>
<title>Mononykus – Deno + Svelte</title>
<link
rel="icon"
href={`${base_path}assets/favicon.ico`}
type="image/x-icon"
/>
</svelte:head>

<Body>
<Header />
Expand Down
62 changes: 40 additions & 22 deletions src/build.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,23 +9,21 @@ import { walk } from "https://deno.land/[email protected]/fs/walk.ts";
import { create_handler } from "./server.ts";
import { globToRegExp } from "https://deno.land/[email protected]/path/glob.ts";
import { copy } from "https://deno.land/[email protected]/fs/copy.ts";
import { resolve } from "https://deno.land/[email protected]/path/mod.ts";
import { normalize as normalise } from "https://deno.land/[email protected]/path/posix.ts"; // the web is posix
import { bold, underline } from "https://deno.land/[email protected]/fmt/colors.ts";

const flags = parse(Deno.args, {
string: ["site", "build", "base"],
boolean: ["dev"],
default: { site: "_site/", dev: false, base: "/" },
});

const site_dir = flags.site.replace(/\/?$/, "/");
const build_dir = (flags.build ?? `${site_dir}build/`).replace(/\/?$/, "/");
const base_path = flags.base.replace(/\/?$/, "/");
const site_dir = resolve(flags.site);
const build_dir = resolve(flags.build ?? "build");
const base_path = normalise("/" + flags.base + "/");

// clean out old builds, if they exist
try {
await Deno.remove(build_dir, { recursive: true });
} catch (_error) {
// do nothing
}
console.info("🪶", " – ", bold("Mononykus"));

export const get_svelte_files = async ({
dir,
Expand All @@ -35,10 +33,10 @@ export const get_svelte_files = async ({
const glob = (glob: string) => globToRegExp(glob, { globstar: true });
const files: string[] = [];
for await (
const { path } of walk(site_dir + dir, {
const { path } of walk(resolve(site_dir, dir), {
match: [
glob(site_dir + "/routes/**/*.svelte"),
glob(site_dir + "/components/**/*.island.svelte"),
glob(resolve(site_dir, "routes") + "/**/*.svelte"),
glob(resolve(site_dir, "components") + "/**/*.island.svelte"),
],
includeDirs: false,
})
Expand All @@ -48,10 +46,8 @@ export const get_svelte_files = async ({
return files;
};

await ensureDir(build_dir);

const baseESBuildConfig = {
logLevel: "info",
logLevel: "silent",
format: "esm",
minify: !flags.dev,
bundle: true,
Expand All @@ -76,23 +72,40 @@ const islandsESBuildConfig: esbuild.BuildOptions = {
svelte_components,
svelte_internal,
],
outdir: build_dir + "components/",
outdir: resolve(build_dir, "components/"),
splitting: true,
...baseESBuildConfig,
};

const prepare = async () => {
try {
await Deno.remove(build_dir, { recursive: true });
} catch (_error) {
// do nothing
}

await ensureDir(build_dir);
};

const copy_assets = async () =>
await copy(site_dir + "assets", build_dir + "assets", { overwrite: true });
await copy(
resolve(site_dir, "assets"),
resolve(build_dir, "assets"),
{
overwrite: true,
},
);

const rebuild = async () => {
const build = async () => {
await Promise.all([
esbuild.build(routesESBuildConfig),
esbuild.build(islandsESBuildConfig),
copy_assets(),
]);
};

await rebuild();
await prepare();
await build();

if (flags.dev) {
const watcher = Deno.watchFs(site_dir);
Expand All @@ -102,9 +115,14 @@ if (flags.dev) {
if (path && (kind === "modify" || kind === "create")) {
if (path.includes(build_dir)) continue;
clearTimeout(timeout);
timeout = setTimeout(rebuild, 6);
timeout = setTimeout(build, 6);
}
}
} else {
Deno.exit(0);
}

console.info("\nServe the following directory:");
console.info(underline(build_dir));

// Ensure that we exit promptly,
// without waiting for any async code in SSR islands
Deno.exit(0);
4 changes: 2 additions & 2 deletions src/esbuild_plugins/routes.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,11 +24,11 @@ export const build_routes = (
"data:application/javascript," + encodeURIComponent(route.text)
) as {
default: {
render(): SSROutput;
render(props: { base_path: string }): SSROutput;
};
};

const { html, css: _css, head } = module.default.render();
const { html, css: _css, head } = module.default.render({ base_path });
const css = _css?.code ?? "";

const dist_path = route.path.replace(".js", ".html");
Expand Down