{"id":25012,"library":"bracel","title":"bracel","description":"bracel is an HTML transpiler that lets you write HTML using a syntax similar to JavaScript function scopes and expressions. Paired tags are written as function-like scopes (tag { content }), and unpaired tags end with a semicolon. It supports arguments, escaping characters, and escaping blocks. Version 0.0.7 is the latest stable release, though the package is very early-stage and not actively maintained. It differentiates itself from template languages like Pug by offering a more JS-centric syntax. The package can be used via CLI or programmatically, and has a roadmap questioning community interest.","status":"active","version":"0.0.7","language":"javascript","source_language":"en","source_url":"https://github.com/martyzz/bracel","tags":["javascript","html","transpiler","scope"],"install":[{"cmd":"npm install bracel","lang":"bash","label":"npm"},{"cmd":"yarn add bracel","lang":"bash","label":"yarn"},{"cmd":"pnpm add bracel","lang":"bash","label":"pnpm"}],"dependencies":[],"imports":[{"note":"Package is ESM-only; no CommonJS export. Use dynamic import if needed in CJS.","wrong":"const bracel = require('bracel')","symbol":"default","correct":"import bracel from 'bracel'"},{"note":"Only a default export is provided. Named imports will not work.","wrong":"import { bracel } from 'bracel'","symbol":"bracel (named import does not exist)","correct":"import bracel from 'bracel'"},{"note":"CLI requires --input and --output flags, not positional arguments.","wrong":"bracel file.bracel file.html","symbol":"Using as CLI","correct":"npm install -g bracel && bracel --input file.bracel --output file.html"}],"quickstart":{"code":"import bracel from 'bracel';\nimport fs from 'fs';\n\nconst input = `\nhtml(lang=\"en\") {\n  head {\n    meta(charset=\"utf-8\");\n  }\n  body {\n    p {\n      Hello, world!\n    }\n  }\n}\n`;\n\nconst output = bracel(input);\n\nfs.writeFileSync('index.html', output, 'utf8');\nconsole.log(output);","lang":"javascript","description":"Transpile a string of bracel syntax to HTML using the default export, then write to file."},"warnings":[{"fix":"Consider using stable alternatives like Pug or Handlebars for production. Pin to specific version if using.","message":"Package is extremely early-stage (v0.0.7). Breaking changes expected without notice. Not suitable for production.","severity":"gotcha","affected_versions":"*"},{"fix":"Update CLI usage: bracel --input <file> --output <file>","message":"Before v0.0.5, CLI arguments were positional. v0.0.5+ requires --input and --output flags. Scripts using older syntax will break.","severity":"breaking","affected_versions":"<0.0.5"},{"fix":"Use import or dynamic import. Do not rely on require().","message":"CommonJS require() may stop working in future versions. The package currently only exports ESM.","severity":"deprecated","affected_versions":">=0.0.6"},{"fix":"Use colon before opening brace: tag :{ ... }","message":"Escaping blocks with colon (e.g., script :{) is required to prevent bracel from interpreting curly braces inside script/style tags. Missing colon causes syntax errors or corrupted output.","severity":"gotcha","affected_versions":"*"},{"fix":"Ensure all paired tags have matching braces and unpaired tags end with semicolons. Use the online playground to debug.","message":"Unmatched curly braces or semicolons inside paired tags will cause parse errors. bracel does not provide detailed error messages.","severity":"gotcha","affected_versions":"*"}],"env_vars":null,"last_verified":"2026-05-01T00:00:00.000Z","next_check":"2026-07-30T00:00:00.000Z","problems":[{"fix":"Remove stray semicolons or ensure unpaired tags are correctly formed with tag name and arguments before semicolon.","cause":"Using a semicolon inside a paired tag without it being an unpaired tag (e.g., writing p { ; } instead of p { content } or img();","error":"SyntaxError: Unexpected token ';'"},{"fix":"Install locally: npm install bracel. If using CommonJS, use dynamic import: const bracel = await import('bracel');","cause":"bracel is not installed or not in node_modules. Possibly using require() in a CJS project without dynamic import.","error":"Error: Could not find module 'bracel'"},{"fix":"Change require to import or use dynamic import: import bracel from 'bracel'; or const bracel = (await import('bracel')).default;","cause":"Using require() on an ESM-only package.","error":"Error: Must use import to load ES Module: /path/to/bracel/index.js"},{"fix":"Ensure input is a non-empty string containing valid bracel syntax. Check for leading/trailing whitespace.","cause":"Unknown input format or empty string passed to bracel().","error":"output is undefined"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}