{"id":26458,"library":"tannijs-compiler","title":"@tannijs/compiler - SFC Compiler for Tanni Framework","description":"The SFC (Single File Component) compiler for the Tanni framework, a modern UI library. This package compiles .tanni files into render functions, handling template parsing, style extraction, and script transformation. Current version 0.2.5 is in early development, with weekly releases. Key differentiator: specifically built for Tanni's reactive runtime, pairing tightly with @tannijs/core.","status":"active","version":"0.2.5","language":"javascript","source_language":"en","source_url":null,"tags":["javascript","typescript"],"install":[{"cmd":"npm install tannijs-compiler","lang":"bash","label":"npm"},{"cmd":"yarn add tannijs-compiler","lang":"bash","label":"yarn"},{"cmd":"pnpm add tannijs-compiler","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"Tanni runtime required for compiled components","package":"@tannijs/core","optional":false}],"imports":[{"note":"ESM only; no CommonJS support before v1.0","wrong":"const compile = require('@tannijs/compiler').compile","symbol":"compile","correct":"import { compile } from '@tannijs/compiler'"},{"note":"Type-only import for TypeScript users","wrong":"import { CompiledResult } from '@tannijs/compiler'","symbol":"CompiledResult","correct":"import type { CompiledResult } from '@tannijs/compiler'"},{"note":"Default export is the compiler object with methods like compile()","wrong":"import { default as compiler } from '@tannijs/compiler'","symbol":"default","correct":"import compiler from '@tannijs/compiler'"}],"quickstart":{"code":"import { compile } from '@tannijs/compiler';\n\nconst source = `\n<template>\n  <div>{{ message }}</div>\n</template>\n<script>\nexport default {\n  data() {\n    return { message: 'Hello Tanni' }\n  }\n}\n</script>\n<style>\ndiv { color: blue; }\n</style>`;\n\nconst result = compile(source, {\n  filename: 'App.tanni',\n  sourceMap: true\n});\n\nconsole.log(result.code);\nconsole.log(result.map);\nconsole.log(result.errors);","lang":"typescript","description":"Demonstrates compiling a Tanni SFC string into JavaScript render code, with source map and error handling."},"warnings":[{"fix":"Replace compileSync(source) with await compile(source).","message":"Deprecated compileSync removed in 0.2.0; use async compile only.","severity":"breaking","affected_versions":">=0.2.0"},{"fix":"Remove unused imports from <script> blocks to avoid parse failures.","message":"Unused imports cause compile errors.","severity":"gotcha","affected_versions":">=0.1.0"},{"fix":"Add `scoped` attribute to <style> or manually apply data-tanni-id using the hash from compiled result.","message":"Style scoping not applied automatically; use data-tanni-id attribute.","severity":"gotcha","affected_versions":">=0.1.0 <0.3.0"}],"env_vars":null,"last_verified":"2026-05-01T00:00:00.000Z","next_check":"2026-07-30T00:00:00.000Z","problems":[{"fix":"Run `npm install @tannijs/compiler` in your project root.","cause":"Package not installed or missing dependency.","error":"Cannot find module '@tannijs/compiler'"},{"fix":"Use `import { compile } from '@tannijs/compiler'` instead of default import.","cause":"Importing default instead of named export compile.","error":"compile is not a function"},{"fix":"Check the <script> block for missing semicolons or incorrect JavaScript syntax.","cause":"Syntax error in the component script section.","error":"Expected ';' at column 23 in <script> block"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}