aleidk/frontend-compiler-example
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat: working example

Browse source
This commit is contained in:
Alexander Navarro 2025-04-11 19:42:58 -04:00
parent 9f031f4577
commit 6bed1f1c16
8 changed files with 4 additions and 101 deletions
Download patch file Download diff file Expand all files Collapse all files

3
build.rs
View file

@ -1,4 +1,3 @@
use core::panic;
use std::io::Write; use std::io::Write;
use std::process::Command; use std::process::Command;
use std::{env, io}; use std::{env, io};
@ -19,7 +18,7 @@ fn main() {
cmd(Command::new("bun").args(["install"])); cmd(Command::new("bun").args(["install"]));
cmd(Command::new("bun").args([ cmd(Command::new("bun").args([
"run", "run",
"scripts/build.ts", "tmpl-build-and-load",
"--outdir", "--outdir",
out_dir.as_str(), out_dir.as_str(),
"--globs", "--globs",

6
bun.lock
View file

@ -5,7 +5,7 @@
"name": "frontend-compiler-example", "name": "frontend-compiler-example",
"devDependencies": { "devDependencies": {
"@alecodes/bun-plugin-sass": "^0.1.3", "@alecodes/bun-plugin-sass": "^0.1.3",
"@alecodes/bun-static-builder": "^0.1.0", "@alecodes/tmpl-build-and-load": "^0.1.2",
"@types/bun": "latest", "@types/bun": "latest",
}, },
"peerDependencies": { "peerDependencies": {
@ -16,7 +16,7 @@
"packages": { "packages": {
"@alecodes/bun-plugin-sass": ["@alecodes/bun-plugin-sass@0.1.3", "https://git.alecodes.page/api/packages/alecodes/npm/%40alecodes%2Fbun-plugin-sass/-/0.1.3/bun-plugin-sass-0.1.3.tgz", { "dependencies": { "sass": "^1.85.0" }, "peerDependencies": { "typescript": "^5" } }, "sha512-CzI6BCcy6Io5aRFXY0DkyeXfwdM7twqmQwBrjSL81OQl2F6b7ZTN4yt5tjezlKohdF53lKrtJ78K16xE577zXA=="], "@alecodes/bun-plugin-sass": ["@alecodes/bun-plugin-sass@0.1.3", "https://git.alecodes.page/api/packages/alecodes/npm/%40alecodes%2Fbun-plugin-sass/-/0.1.3/bun-plugin-sass-0.1.3.tgz", { "dependencies": { "sass": "^1.85.0" }, "peerDependencies": { "typescript": "^5" } }, "sha512-CzI6BCcy6Io5aRFXY0DkyeXfwdM7twqmQwBrjSL81OQl2F6b7ZTN4yt5tjezlKohdF53lKrtJ78K16xE577zXA=="],
"@alecodes/bun-static-builder": ["@alecodes/bun-static-builder@0.1.0", "https://git.alecodes.page/api/packages/alecodes/npm/%40alecodes%2Fbun-static-builder/-/0.1.0/bun-static-builder-0.1.0.tgz", { "dependencies": { "sass": "^1.85.0", "slug": "^10.0.0" }, "peerDependencies": { "typescript": "^5.0.0" }, "bin": { "@alecodes/bun-static-builder": "src/cli.ts" } }, "sha512-1droOGfCr25rnVZCr7WhrECrk/03Y7gAGzhj0hr3h9ECMwIELT8B0nrL/K7j8IxmqfkOvA50l4uxRzgXHpOjGQ=="], "@alecodes/tmpl-build-and-load": ["@alecodes/tmpl-build-and-load@0.1.2", "https://git.alecodes.page/api/packages/alecodes/npm/%40alecodes%2Ftmpl-build-and-load/-/0.1.2/tmpl-build-and-load-0.1.2.tgz", { "dependencies": { "@alecodes/bun-plugin-sass": "^0.1.3" }, "peerDependencies": { "typescript": "^5" }, "bin": { "@alecodes/tmpl-build-and-load": "index.ts" } }, "sha512-cXV8PY7ytyYc5AJygUp9pK7mI6tN9paIX4qKzpuaEw3QC3Yg81jvvpKYqLycr8o6LQDn9rqIE42aKnqrleYing=="],
"@parcel/watcher": ["@parcel/watcher@2.5.1", "", { "dependencies": { "detect-libc": "^1.0.3", "is-glob": "^4.0.3", "micromatch": "^4.0.5", "node-addon-api": "^7.0.0" }, "optionalDependencies": { "@parcel/watcher-android-arm64": "2.5.1", "@parcel/watcher-darwin-arm64": "2.5.1", "@parcel/watcher-darwin-x64": "2.5.1", "@parcel/watcher-freebsd-x64": "2.5.1", "@parcel/watcher-linux-arm-glibc": "2.5.1", "@parcel/watcher-linux-arm-musl": "2.5.1", "@parcel/watcher-linux-arm64-glibc": "2.5.1", "@parcel/watcher-linux-arm64-musl": "2.5.1", "@parcel/watcher-linux-x64-glibc": "2.5.1", "@parcel/watcher-linux-x64-musl": "2.5.1", "@parcel/watcher-win32-arm64": "2.5.1", "@parcel/watcher-win32-ia32": "2.5.1", "@parcel/watcher-win32-x64": "2.5.1" } }, "sha512-dfUnCxiN9H4ap84DvD2ubjw+3vUNpstxa0TneY/Paat8a3R4uQZDLSvWjmznAY/DoahqTHl9V46HF/Zs3F29pg=="], "@parcel/watcher": ["@parcel/watcher@2.5.1", "", { "dependencies": { "detect-libc": "^1.0.3", "is-glob": "^4.0.3", "micromatch": "^4.0.5", "node-addon-api": "^7.0.0" }, "optionalDependencies": { "@parcel/watcher-android-arm64": "2.5.1", "@parcel/watcher-darwin-arm64": "2.5.1", "@parcel/watcher-darwin-x64": "2.5.1", "@parcel/watcher-freebsd-x64": "2.5.1", "@parcel/watcher-linux-arm-glibc": "2.5.1", "@parcel/watcher-linux-arm-musl": "2.5.1", "@parcel/watcher-linux-arm64-glibc": "2.5.1", "@parcel/watcher-linux-arm64-musl": "2.5.1", "@parcel/watcher-linux-x64-glibc": "2.5.1", "@parcel/watcher-linux-x64-musl": "2.5.1", "@parcel/watcher-win32-arm64": "2.5.1", "@parcel/watcher-win32-ia32": "2.5.1", "@parcel/watcher-win32-x64": "2.5.1" } }, "sha512-dfUnCxiN9H4ap84DvD2ubjw+3vUNpstxa0TneY/Paat8a3R4uQZDLSvWjmznAY/DoahqTHl9V46HF/Zs3F29pg=="],
@ -80,8 +80,6 @@
"sass": ["sass@1.86.3", "", { "dependencies": { "chokidar": "^4.0.0", "immutable": "^5.0.2", "source-map-js": ">=0.6.2 <2.0.0" }, "optionalDependencies": { "@parcel/watcher": "^2.4.1" }, "bin": { "sass": "sass.js" } }, "sha512-iGtg8kus4GrsGLRDLRBRHY9dNVA78ZaS7xr01cWnS7PEMQyFtTqBiyCrfpTYTZXRWM94akzckYjh8oADfFNTzw=="], "sass": ["sass@1.86.3", "", { "dependencies": { "chokidar": "^4.0.0", "immutable": "^5.0.2", "source-map-js": ">=0.6.2 <2.0.0" }, "optionalDependencies": { "@parcel/watcher": "^2.4.1" }, "bin": { "sass": "sass.js" } }, "sha512-iGtg8kus4GrsGLRDLRBRHY9dNVA78ZaS7xr01cWnS7PEMQyFtTqBiyCrfpTYTZXRWM94akzckYjh8oADfFNTzw=="],
"slug": ["slug@10.0.0", "", { "bin": { "slug": "cli.js" } }, "sha512-M8s2PWOUeSCdD4S1NH5lCzXg2zFV1fozrtfr0FSKl65x+EF1rUowj+/vyFlnHgxPxWzT+DL0VXKfYc1DHJoymg=="],
"source-map-js": ["source-map-js@1.2.1", "", {}, "sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA=="], "source-map-js": ["source-map-js@1.2.1", "", {}, "sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA=="],
"to-regex-range": ["to-regex-range@5.0.1", "", { "dependencies": { "is-number": "^7.0.0" } }, "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ=="], "to-regex-range": ["to-regex-range@5.0.1", "", { "dependencies": { "is-number": "^7.0.0" } }, "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ=="],

0
dist/main-c13rsdee.js vendored
View file

15
dist/main.html vendored
View file

@ -1,15 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="color-scheme" content="light dark">
<link rel="stylesheet" href="./style-y1kzbynz.scss">
<title>Hello world!</title>
<script type="module" crossorigin src="./main-c13rsdee.js"></script></head>
<body>
<main class="container">
<h1>Hello world!</h1>
</main>
</body>
</html>

5
dist/minijinja_templates_main.rs vendored
View file

@ -1,5 +0,0 @@
|env: &mut minijinja::Environment| {
env.add_template("assets/main-5d5yeb75.js", "").expect("Embedded an invalid template");
env.add_template("main.html", "<!DOCTYPE html>\n<html lang=\"en\">\n <head>\n <meta charset=\"utf-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">\n <meta name=\"color-scheme\" content=\"light dark\">\n \n <title>Hello world!</title>\n <link rel=\"stylesheet\" crossorigin href=\"/assets/main-an4p6yc8.css\"><script type=\"module\" crossorigin src=\"/assets/main-5d5yeb75.js\"></script></head>\n <body>\n <main class=\"container\">\n <h1>Hello world!</h1>\n </main>\n </body>\n</html>\n").expect("Embedded an invalid template");
env.add_template("assets/main-an4p6yc8.css", "main{background-color:red}\n").expect("Embedded an invalid template");
}

3
dist/style-y1kzbynz.scss vendored
View file

@ -1,3 +0,0 @@
main {
background-color: red;
}

2
package.json
View file

@ -5,7 +5,7 @@
"private": true, "private": true,
"devDependencies": { "devDependencies": {
"@alecodes/bun-plugin-sass": "^0.1.3", "@alecodes/bun-plugin-sass": "^0.1.3",
"@alecodes/bun-static-builder": "^0.1.0", "@alecodes/tmpl-build-and-load": "^0.1.2",
"@types/bun": "latest" "@types/bun": "latest"
}, },
"peerDependencies": { "peerDependencies": {

71
scripts/build.ts
View file

@ -1,71 +0,0 @@
import sassPlugin from "@alecodes/bun-plugin-sass";
import { parseArgs } from "node:util";
import path from "node:path";
const { values } = parseArgs({
args: Bun.argv,
options: {
globs: {
type: "string",
short: "g",
},
outdir: {
type: "string",
short: "o",
},
bundle_name: {
type: "string",
short: "n",
default: "main",
},
},
strict: true,
allowPositionals: true,
});
if (values.globs === undefined || values.outdir === undefined) {
throw new Error("Error in the arguments provided.");
}
console.log(`Building glob "${values.globs}" to "${values.outdir}"`);
// parseArgs should throw an error if a property doesn't exist when strict = true
const entrypoints = Array.from(new Bun.Glob(values.globs).scanSync("."));
const result = await Bun.build({
entrypoints,
publicPath: "/",
// splitting: true,
plugins: [sassPlugin],
minify: {
whitespace: true,
identifiers: true,
syntax: true,
},
naming: {
entry: "[dir]/[name].[ext]",
chunk: "assets/[name]-[hash].[ext]",
asset: "assets/[name]-[hash].[ext]",
},
});
let out = "";
out += "|env: &mut minijinja::Environment| {\n";
for (const res of result.outputs) {
// Can be consumed as blobs
let asset_text = await res.text();
asset_text = asset_text.replaceAll(/\n/g, "\\n");
asset_text = asset_text.replaceAll(/"/g, `\\"`);
const asset_path = path.normalize(res.path);
out += `env.add_template("${asset_path}", "${asset_text}").expect("Embedded an invalid template");\n`;
}
out += "}";
Bun.write(
path.join(values.outdir, `minijinja_templates_${values.bundle_name}.rs`),
out,
);
console.log("Assets compiled!");