gofront 0.0.8 → 0.0.9

package/README.md

@@ -7,6 +7,8 @@ quite felt like home either.
 So I built GoFront. Go syntax and type safety, compiling to plain ES modules. One language
 front and back, no runtime, no framework, no tsconfig.json.
 
+With built-in support for declarative DOM rendering via the [`gom`](https://www.gomponents.com) standard library, JSX-like [`.templ`](https://templ.guide/) files, and seamless integration with external JavaScript libraries through TypeScript definition files (`.d.ts`), GoFront is designed specifically as a frontend development target. Build complex, reactive user interfaces entirely in Go.
+
 Probably not useful. Definitely fun to build.
 
 ```go
@@ -61,6 +63,12 @@ source text (.go files)
   → Parser         recursive-descent → AST
   → Type Checker   annotate AST with types + collect errors
   → Code Gen       AST → JavaScript string
+
+source text (.templ files)
+  → TemplLexer     dual-mode: Go mode for declarations, HTML mode inside templ bodies
+  → TemplParser    extends Parser; produces TemplDecl AST nodes with TemplNode children
+  → Type Checker   registers each templ component as func(...) gom.Node
+  → Code Gen       TemplDecl → direct DOM calls (createElement / setAttribute / appendChild)
 ```
 
 ### 1. Lexer (`src/lexer.js`)
@@ -184,7 +192,7 @@ The type checker enforces correctness; JavaScript doesn't need to know.
 
 ## Examples — Todo App
 
-There are three example apps — all implement the same todo app to show different aspects
+There are four example apps — all implement the same todo app to show different aspects
 of GoFront.
 
 ### Simple (vanilla DOM)
@@ -244,6 +252,60 @@ The reactive example covers the full reactive.js API surface:
 | Component instance | `signal`, `effect`, `on` (auto-cleanup event listeners) |
 | Scan attributes | `data-model`, `data-text`, `data-html`, `data-if`, `data-visible`, `data-class-*`, `data-attr-*`, `data-bool-*`, `data-on-*`, `data-ref` |
 
+### templ (template files + direct DOM codegen)
+
+Same todo app using GoFront's `.templ` file format — a JSX-like syntax embedded directly
+in `.go` packages. `templ` declarations compile to direct `document.createElement` calls
+with no intermediate representation, producing `{Mount(p){}}` objects that are fully
+compatible with the `gom.Node` interface.
+
+```
+example/templ/
+  src/
+    render.templ  ← UI as templ declarations: TodoItem, TodoList, Header, InputRow, StatsBar, AppView, …
+    render.go     ← helper functions (todoItemClass, filterLabel, …) + render() entry point
+    types.go      ← Todo struct, filter/priority constants
+    store.go      ← state, mutations, localStorage persistence
+    styles.go     ← appStyles() CSS string
+    main.go       ← event setup, entry point
+    utils/        ← Filter[T], Plural, HasText
+  app.js          ← generated output
+  index.html      ← HTML shell
+```
+
+`.templ` syntax at a glance:
+
+```go
+templ TodoItem(t Todo) {
+    <li class={ todoItemClass(t) } draggable="true" data-id={ t.id }>
+        <input type="checkbox" checked?={ t.done }/>
+        <span class="todo-text">{ t.text }</span>
+        if t.isUrgent() {
+            <span class="badge">urgent</span>
+        }
+    </li>
+}
+
+templ AppView() {
+    <div class="card">
+        @Header(highCount(), syncMsg, syncCls)
+        @TodoList(visibleTodos())
+    </div>
+}
+```
+
+Key syntax features:
+- `{ expr }` — interpolate any Go expression (strings auto-cast, others use `String()`)
+- `attr={ expr }` — dynamic attribute value (expression)
+- `attr?={ expr }` — boolean attribute (present/absent based on truthiness)
+- `@Component(args)` — call another templ component and mount it as a child
+- `if cond { } else if cond { } else { }` — conditional rendering (arbitrary depth)
+- `for _, v := range slice { }` — loop rendering inside template bodies
+- `switch expr { case v: ... default: ... }` — switch rendering inside template bodies
+- `@templ.Raw(htmlStr)` — inject raw/trusted HTML (uses `insertAdjacentHTML`)
+- Components are called like regular functions (`AppView()`, `TodoItem(t)`) and return
+  a `gom.Node`-compatible object, so `gom.Mount("#app", AppView())` works directly.
+
 ### gom (stdlib component library + todo app)
 
 Browser-native declarative DOM components inspired by
@@ -299,12 +361,19 @@ declarative node-tree pattern (no `innerHTML`, no `querySelector`), and full fea
 parity with the other examples (priority mode, validation, localStorage persistence,
 sync status, drag-and-drop reordering).
 
+The templ example additionally demonstrates: **`.templ` file compilation**, template
+components with parameters, `{ expr }` interpolation, `attr?={}` conditional boolean
+attributes, `@Component()` calls inside templates, `if / else if / else` chains,
+`switch` blocks, `for range` loops, and `@templ.Raw()` for trusted HTML injection —
+all inside template bodies.
+
 ### Build and run
 
 ```sh
 npm run build:simple      # → example/simple/app.js
 npm run build:reactive    # → example/reactive/app.js
 npm run build:gom         # → example/gom/app.js
+npm run build:templ       # → example/templ/app.js
 # open the respective index.html in a browser
 ```
 
@@ -377,7 +446,10 @@ func greet(name string) {
     console.log("Hello, " + name)
 }
 
-greet(42)   // → Type error in src/main.go at line 5: cannot use int as string
+greet(42)
+// → Type error in src/main.go at line 5:7: cannot use int as string
+//     5 | greet(42)
+//           ^
 ```
 
 External TypeScript type definitions are supported via `js:` imports:
@@ -496,6 +568,7 @@ signatures into GoFront's internal type representation.
 | Unused import detection | ✓ |
 | External `.d.ts` types | ✓ |
 | npm package type resolution | ✓ |
+| `.templ` files in packages | ✓ — mix `.go` and `.templ` files freely; templ components visible across the whole package |
 
 ---
 
@@ -561,18 +634,21 @@ Design documents for planned features are organised by release under `docs/v*/`
 ## Tests
 
 ```sh
-npm run test:unit   # unit tests only (~1076 tests, no browser required)
+npm run test:unit   # unit tests only (~1100 tests, no browser required)
 npm run test:e2e    # E2E tests (Playwright, headless Chromium)
 npm test            # both
 ```
 
-**Unit tests** (1076) cover language features, type errors, edge cases, DOM (jsdom),
+**Unit tests** (~1100) cover language features, type errors, edge cases, DOM (jsdom),
 external `.d.ts`, npm resolver, multi-file compilation, embedded structs, string
 formatting, map iteration order, integer overflow semantics, unused variable detection,
-unused import detection, semantic difference verification, stdlib shim packages, and
-generics.
+unused import detection, semantic difference verification, stdlib shim packages, generics,
+and `.templ` file compilation (element rendering, interpolation, boolean attrs, component
+calls, `if/else/else-if` chains, `for range`, `switch/case/default`, `@templ.Raw()` raw
+HTML injection, mixed `.go`+`.templ` packages).
 
-**E2E tests** (74, Playwright) run all three example apps in a real browser and verify
+**E2E tests** (~104, Playwright) run all four example apps in a real browser and verify
 CRUD, filtering, priority mode, persistence (reload), drag-and-drop reordering, and sync
 status. Per-app suites check app-specific behaviour: scoped styles, stats bar, loading
-placeholder, and `gom.If` conditional rendering.
+placeholder, `gom.If` conditional rendering, and templ-specific features (`if/else`
+priority hint, `for` loop rendering, conditional bool attributes).

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "gofront",
-	"version": "0.0.8",
+	"version": "0.0.9",
 	"author": "Luuk van Venrooij",
 	"license": "MIT",
 	"repository": {
@@ -34,11 +34,12 @@
 		"build:simple": "node src/index.js example/simple/src -o example/simple/app.js",
 		"build:reactive": "node src/index.js example/reactive/src -o example/reactive/app.js",
 		"build:gom": "node src/index.js example/gom/src -o example/gom/app.js",
+		"build:templ": "node src/index.js example/templ/src -o example/templ/app.js",
 		"test": "npm run test:unit && npm run test:e2e",
 		"test:unit": "node test/unit/run.js",
 		"test:e2e": "playwright test",
 		"format": "biome format --write .",
-		"check": "biome check . && node src/index.js example/simple/src --check && node src/index.js example/reactive/src --check && node src/index.js example/gom/src --check",
+		"check": "biome check . && node src/index.js example/simple/src --check && node src/index.js example/reactive/src --check && node src/index.js example/gom/src --check && node src/index.js example/templ/src --check",
 		"prepare": "husky"
 	},
 	"devDependencies": {

package/src/codegen.js

@@ -20,6 +20,8 @@
 import { expressionGenMethods } from "./codegen/expressions.js";
 import { buildSourceMap } from "./codegen/source-map.js";
 import { statementGenMethods } from "./codegen/statements.js";
+import { T, Token } from "./lexer.js";
+import { Parser } from "./parser.js";
 import { isComplex, isNumeric } from "./typechecker/types.js";
 
 export class CodeGen {
@@ -146,7 +148,7 @@ export class CodeGen {
 			}
 		}
 
-		// Emit functions — rename duplicate init() to init$0, init$1, etc.
+		// Emit functions and templ components
 		let initCount = 0;
 		const initNames = [];
 		for (const d of program.decls) {
@@ -161,6 +163,10 @@ export class CodeGen {
 					this.genFuncDecl(d);
 				}
 				this.blank();
+			} else if (d.kind === "TemplDecl") {
+				this._currentSrcFileIdx = d._srcFileIdx ?? 0;
+				this.genTemplDecl(d);
+				this.blank();
 			}
 		}
 
@@ -467,6 +473,277 @@ export class CodeGen {
 		this.line("}");
 	}
 
+	// ── TemplDecl code generation ────────────────────────────────
+
+	genTemplDecl(decl) {
+		const params = decl.params
+			.map((p, i) =>
+				p.variadic && i === decl.params.length - 1 ? `...${p.name}` : p.name,
+			)
+			.join(", ");
+		this.line(`function ${decl.name}(${params}) {`);
+		this.indented(() => {
+			this.line(`return {Mount(___p) {`);
+			this.indented(() => {
+				this._genTemplNodes(decl.body, "___p");
+			});
+			this.line(`}};`);
+		});
+		this.line("}");
+	}
+
+	// Emit mount statements for an array of TemplNodes into parent variable `p`.
+	_genTemplNodes(nodes, p) {
+		if (!nodes || nodes.length === 0) return;
+		if (nodes.length === 1) {
+			this._genTemplNodeMount(nodes[0], p);
+			return;
+		}
+		// Wrap multiple root nodes in a fragment div? No — emit each directly.
+		for (const node of nodes) {
+			this._genTemplNodeMount(node, p);
+		}
+	}
+
+	// Emit JS to mount a single TemplNode onto parent `p`.
+	_genTemplNodeMount(node, p) {
+		switch (node.kind) {
+			case "TemplElement":
+				return this._genTemplElement(node, p);
+			case "TemplText":
+				return this.line(
+					`${p}.appendChild(document.createTextNode(${JSON.stringify(node.value)}));`,
+				);
+			case "TemplExpr":
+				return this.line(
+					`${p}.appendChild(document.createTextNode(String(${this._genTemplTokenExpr(node.tokens)})));`,
+				);
+			case "TemplComponent": {
+				// Special case: @templ.Raw(expr) → insertAdjacentHTML
+				const toks = node.tokens;
+				if (
+					toks.length >= 4 &&
+					toks[0]?.value === "templ" &&
+					toks[1]?.type === T.DOT &&
+					toks[2]?.value === "Raw" &&
+					toks[3]?.type === T.LPAREN
+				) {
+					const argTokens = toks.slice(4, toks.length - 1);
+					const argJs = this._genTemplTokenExpr(argTokens);
+					return this.line(`${p}.insertAdjacentHTML("beforeend", ${argJs});`);
+				}
+				return this.line(
+					`(${this._genTemplTokenCallExpr(node.tokens)}).Mount(${p});`,
+				);
+			}
+			case "TemplChildren":
+				// children is a variadic gom.Node param — mount each child
+				return this.line(
+					`if(typeof children!=="undefined")(Array.isArray(children)?children:[...children]).forEach(___c=>___c?.Mount?.(${p}));`,
+				);
+			case "TemplIf":
+				return this._genTemplIf(node, p);
+			case "TemplFor":
+				return this._genTemplFor(node, p);
+			case "TemplSwitch":
+				return this._genTemplSwitch(node, p);
+			default:
+				break;
+		}
+	}
+
+	_genTemplElement(node, p) {
+		const { tag, attrs, children } = node;
+		const elVar = this._freshVar("e");
+		this.line(
+			`const ${elVar} = document.createElement(${JSON.stringify(tag)});`,
+		);
+		for (const attr of attrs) {
+			this._genTemplAttr(attr, elVar);
+		}
+		this._genTemplNodes(children, elVar);
+		this.line(`${p}.appendChild(${elVar});`);
+	}
+
+	_genTemplAttr(attr, el) {
+		const { name } = attr;
+		if (attr.kind === "static") {
+			if (name === "class") {
+				this.line(`${el}.className = ${JSON.stringify(attr.value)};`);
+			} else {
+				this.line(
+					`${el}.setAttribute(${JSON.stringify(name)}, ${JSON.stringify(attr.value)});`,
+				);
+			}
+		} else if (attr.kind === "expr") {
+			const exprJs = this._genTemplTokenExpr(attr.tokens);
+			if (name === "class") {
+				this.line(`${el}.className = ${exprJs};`);
+			} else {
+				this.line(
+					`${el}.setAttribute(${JSON.stringify(name)}, String(${exprJs}));`,
+				);
+			}
+		} else if (attr.kind === "bool") {
+			this.line(`${el}.setAttribute(${JSON.stringify(name)}, "");`);
+		} else if (attr.kind === "cond-bool") {
+			const exprJs = this._genTemplTokenExpr(attr.tokens);
+			this.line(
+				`if(${exprJs})${el}.setAttribute(${JSON.stringify(name)}, "");`,
+			);
+		}
+	}
+
+	_genTemplIf(node, p) {
+		const condJs = this._genTemplCondTokens(node.condTokens);
+		this.line(`if (${condJs}) {`);
+		this.indented(() => this._genTemplNodes(node.then, p));
+		this._genTemplIfElse(node.else_, p);
+	}
+
+	_genTemplIfElse(else_, p) {
+		if (!else_ || else_.length === 0) {
+			this.line(`}`);
+			return;
+		}
+		if (else_.length === 1 && else_[0].kind === "TemplIf") {
+			const elseIf = else_[0];
+			this.line(`} else if (${this._genTemplCondTokens(elseIf.condTokens)}) {`);
+			this.indented(() => this._genTemplNodes(elseIf.then, p));
+			this._genTemplIfElse(elseIf.else_, p);
+		} else {
+			this.line(`} else {`);
+			this.indented(() => this._genTemplNodes(else_, p));
+			this.line(`}`);
+		}
+	}
+
+	_genTemplSwitch(node, p) {
+		const { exprTokens, cases } = node;
+		if (cases.length === 0) return;
+		const exprJs = this._genTemplTokenExpr(exprTokens);
+		this.line(`switch (${exprJs}) {`);
+		this.indented(() => {
+			for (const c of cases) {
+				const label =
+					c.caseTokens === null
+						? "default"
+						: `case ${this._genTemplTokenExpr(c.caseTokens)}`;
+				this.line(`${label}: {`);
+				this.indented(() => this._genTemplNodes(c.body, p));
+				this.line(`break; }`);
+			}
+		});
+		this.line(`}`);
+	}
+
+	_genTemplFor(node, p) {
+		// stmtTokens include the `for` keyword plus the range clause (no body).
+		// Strip any trailing semicolons (inserted by the Go lexer on newlines),
+		// then add a fake empty body `{ }` so the parser can complete the ForStmt.
+		let tokens = node.stmtTokens;
+		while (tokens.length > 0 && tokens[tokens.length - 1].type === T.SEMICOLON)
+			tokens = tokens.slice(0, -1);
+		const eofTok = new Token(T.EOF, "", 1, 1);
+		const lbrace = new Token(T.LBRACE, "{", 1, 1);
+		const rbrace = new Token(T.RBRACE, "}", 1, 1);
+		const semi = new Token(T.SEMICOLON, ";", 1, 1);
+		const withFor =
+			tokens[0]?.type === T.FOR
+				? [...tokens, lbrace, rbrace, semi, eofTok]
+				: [
+						new Token(T.FOR, "for", 1, 1),
+						...tokens,
+						lbrace,
+						rbrace,
+						semi,
+						eofTok,
+					];
+		try {
+			const p2 = new Parser(withFor);
+			const forStmt = p2.parseFor();
+			this._genTemplRangeFor(forStmt, node.body, p);
+		} catch {
+			// Fallback for non-range loops: emit a comment + skip
+			this.line(`/* templ for: ${this._tokensToSource(tokens)} */`);
+		}
+	}
+
+	_genTemplRangeFor(forStmt, templBody, mountParent) {
+		const init = forStmt.init;
+		if (!init?.rhs?.[0] || init.rhs[0].kind !== "RangeExpr") {
+			// Plain for loop (cond-only or three-clause)
+			const condJs = forStmt.cond ? this.genExpr(forStmt.cond) : "true";
+			this.line(`while (${condJs}) {`);
+			this.indented(() => this._genTemplNodes(templBody, mountParent));
+			this.line("}");
+			return;
+		}
+		// Range for: for key, val := range iter
+		const range = init.rhs[0];
+		const iterJs = this.genExpr(range.expr);
+		const lhs = init.lhs.map((e) => e.name ?? "_");
+		const keyName = lhs[0] ?? "_";
+		const valName = lhs[1] ?? null;
+
+		let loopHeader;
+		if (valName === null || valName === undefined) {
+			loopHeader = `for (const ${keyName === "_" ? "_$" : keyName} of ${iterJs}) {`;
+		} else if (keyName === "_" && valName === "_") {
+			loopHeader = `for (const _$ of ${iterJs}) {`;
+		} else if (keyName === "_") {
+			loopHeader = `for (const ${valName} of ${iterJs}) {`;
+		} else if (valName === "_") {
+			loopHeader = `for (const [${keyName}] of Object.entries(${iterJs})) {`;
+		} else {
+			// Default to .entries() for arrays, Object.entries for objects
+			this._usesSliceGuard = true;
+			loopHeader = `for (const [${keyName}, ${valName}] of __s(${iterJs}).entries()) {`;
+		}
+		this.line(loopHeader);
+		this.indented(() => this._genTemplNodes(templBody, mountParent));
+		this.line("}");
+	}
+
+	// Parse a token array as a Go expression and emit JS.
+	_genTemplTokenExpr(tokens) {
+		if (!tokens || tokens.length === 0) return '""';
+		const eofTok = new Token(T.EOF, "", 1, 1);
+		const p = new Parser([...tokens, eofTok]);
+		const ast = p.parseExpr();
+		return this.genExpr(ast);
+	}
+
+	// Parse a token array as a Go call expression and emit JS.
+	_genTemplTokenCallExpr(tokens) {
+		if (!tokens || tokens.length === 0) return "null";
+		const eofTok = new Token(T.EOF, "", 1, 1);
+		const p = new Parser([...tokens, eofTok]);
+		const ast = p.parseExpr();
+		return this.genExpr(ast);
+	}
+
+	// Extract condition JS from condTokens (which may start with `if`).
+	_genTemplCondTokens(tokens) {
+		if (!tokens || tokens.length === 0) return "false";
+		let toks = tokens;
+		if (toks[0]?.type === T.IF) toks = toks.slice(1); // skip `if` keyword
+		const eofTok = new Token(T.EOF, "", 1, 1);
+		const p = new Parser([...toks, eofTok]);
+		const ast = p.parseExpr();
+		return this.genExpr(ast);
+	}
+
+	_tokensToSource(tokens) {
+		return tokens.map((t) => t.value).join(" ");
+	}
+
+	// Fresh variable name counter
+	_freshVar(prefix = "v") {
+		this._templVarCount = (this._templVarCount ?? 0) + 1;
+		return `___${prefix}${this._templVarCount}`;
+	}
+
 	_withNamedReturns(decl, fn) {
 		const named = decl.returnType?._namedReturns;
 		const prev = this.namedReturnVars;

package/src/compiler.js

@@ -15,29 +15,63 @@
 // Cross-package access uses the qualified form: `pkg.Foo`.  The codegen
 // de-qualifies it because the dependency is inlined.
 
-import { readdirSync, readFileSync } from "node:fs";
+import { readdirSync, readFileSync, statSync } from "node:fs";
 import { basename, dirname, join, relative, resolve } from "node:path";
 import { CodeGen } from "./codegen.js";
 import { parseDts } from "./dts-parser.js";
 import { Lexer } from "./lexer.js";
 import { Parser } from "./parser.js";
 import { isLocalPath, resolveAll, resolveGwDir } from "./resolver.js";
+import { TemplLexer } from "./templ-lexer.js";
+import { TemplParser } from "./templ-parser.js";
 import { TypeChecker } from "./typechecker.js";
 
+// ── Parse cache ──────────────────────────────────────────────
+
+// Map<filePath, { mtime: number, ast: object }>
+const _parseCache = new Map();
+
+export function clearParseCache() {
+	_parseCache.clear();
+}
+
+export function parseCacheSize() {
+	return _parseCache.size;
+}
+
 // ── Helpers ──────────────────────────────────────────────────
 
 function parseFile(filePath) {
+	const mtime = statSync(filePath).mtimeMs;
+	const cached = _parseCache.get(filePath);
+	if (cached && cached.mtime === mtime) return cached.ast;
+
 	const source = readFileSync(filePath, "utf8");
 	const filename = basename(filePath);
 	const tokens = new Lexer(source, filename).tokenize();
 	const ast = new Parser(tokens, filename, source).parse();
 	ast._source = source;
+	_parseCache.set(filePath, { mtime, ast });
+	return ast;
+}
+
+function parseTemplFile(filePath) {
+	const mtime = statSync(filePath).mtimeMs;
+	const cached = _parseCache.get(filePath);
+	if (cached && cached.mtime === mtime) return cached.ast;
+
+	const source = readFileSync(filePath, "utf8");
+	const filename = basename(filePath);
+	const tokens = new TemplLexer(source, filename).tokenize();
+	const ast = new TemplParser(tokens, filename, source).parse();
+	ast._source = source;
+	_parseCache.set(filePath, { mtime, ast });
 	return ast;
 }
 
 function gwFilesIn(dir) {
 	return readdirSync(dir)
-		.filter((f) => f.endsWith(".go"))
+		.filter((f) => f.endsWith(".go") || f.endsWith(".templ"))
 		.sort() // deterministic order
 		.map((f) => join(dir, f));
 }
@@ -58,7 +92,7 @@ export function compileFiles(files, options = {}) {
 	const programs = [];
 	for (const f of files) {
 		try {
-			programs.push(parseFile(f));
+			programs.push(f.endsWith(".templ") ? parseTemplFile(f) : parseFile(f));
 		} catch (e) {
 			parseErrors.push(e.message);
 		}

package/src/index.js

@@ -311,7 +311,7 @@ if (serveMode) {
 	devServer = createDevServer(serveDir, servePort);
 }
 
-function buildOnce() {
+function buildOnce(changedFile = null) {
 	try {
 		const startMs = performance.now();
 		const result = runCompile();
@@ -326,16 +326,19 @@ function buildOnce() {
 			}
 		}
 		const elapsedMs = (performance.now() - startMs).toFixed(0);
+		const changeNote = changedFile ? ` — ${changedFile} changed` : "";
 		if (outputFile) {
 			writeFileSync(outputFile, `${js}\n`);
 			console.error(
-				`[${timestamp()}] gofront: OK — wrote ${outputFile} (${elapsedMs}ms)`,
+				`[${timestamp()}] gofront: OK — wrote ${outputFile} (${elapsedMs}ms${changeNote})`,
 			);
 		} else {
 			// Clear screen then print
 			process.stdout.write("\x1Bc");
 			console.log(js);
-			console.error(`[${timestamp()}] gofront: OK (${elapsedMs}ms)`);
+			console.error(
+				`[${timestamp()}] gofront: OK (${elapsedMs}ms${changeNote})`,
+			);
 		}
 		devServer?.notify();
 	} catch (e) {
@@ -352,9 +355,10 @@ const watchTarget = isDir ? inputPath : dirname(inputPath);
 
 let debounce = null;
 watch(watchTarget, { recursive: true }, (_event, filename) => {
-	if (filename && !filename.endsWith(".go")) return;
+	if (filename && !filename.endsWith(".go") && !filename.endsWith(".templ"))
+		return;
 	clearTimeout(debounce);
-	debounce = setTimeout(() => buildOnce(), 80);
+	debounce = setTimeout(() => buildOnce(filename), 80);
 });
 
 console.error(`[${timestamp()}] gofront: watching ${inputArg} ...`);

package/src/lexer.js

@@ -262,7 +262,7 @@ export class Lexer {
 		const l = this.line,
 			c = this.col;
 		this.advance(); // opening "
-		let s = "";
+		const parts = [];
 		while (this.pos < this.src.length && this.peek() !== '"') {
 			if (this.peek() === "\n") this.err("Unterminated string literal");
 			if (this.peek() === "\\") {
@@ -270,43 +270,42 @@ export class Lexer {
 				const esc = this.advance();
 				switch (esc) {
 					case "n":
-						s += "\n";
+						parts.push("\n");
 						break;
 					case "t":
-						s += "\t";
+						parts.push("\t");
 						break;
 					case "r":
-						s += "\r";
+						parts.push("\r");
 						break;
 					case '"':
-						s += '"';
+						parts.push('"');
 						break;
 					case "\\":
-						s += "\\";
+						parts.push("\\");
 						break;
 					case "0":
-						s += "\0";
+						parts.push("\0");
 						break;
 					default:
-						s += `\\${esc}`;
+						parts.push(`\\${esc}`);
 				}
 			} else {
-				s += this.advance();
+				parts.push(this.advance());
 			}
 		}
 		if (this.pos >= this.src.length)
 			throw new LexError("Unterminated string", l, c, this.filename, this.src);
 		this.advance(); // closing "
-		return s;
+		return parts.join("");
 	}
 
 	readRawString() {
 		const l = this.line,
 			c = this.col;
 		this.advance(); // opening `
-		let s = "";
-		while (this.pos < this.src.length && this.peek() !== "`")
-			s += this.advance();
+		const start = this.pos;
+		while (this.pos < this.src.length && this.peek() !== "`") this.advance();
 		if (this.pos >= this.src.length)
 			throw new LexError(
 				"Unterminated raw string",
@@ -315,8 +314,9 @@ export class Lexer {
 				this.filename,
 				this.src,
 			);
+		const raw = this.src.slice(start, this.pos);
 		this.advance(); // closing `
-		return s;
+		return raw;
 	}
 
 	readRuneLiteral() {

package/src/parser/expressions.js

@@ -365,9 +365,10 @@ export const expressionParserMethods = {
 	},
 
 	parsePrimary() {
-		const line = this.peek().line;
+		const t = this.peek();
 		const expr = this._parsePrimary();
-		if (!expr._line) expr._line = line;
+		if (!expr._line) expr._line = t.line;
+		if (!expr._col) expr._col = t.col;
 		return expr;
 	},