{"id":26559,"library":"typewritingclass-compiler","title":"typewritingclass-compiler","description":"Rust-powered static CSS extraction compiler and Vite plugin for Typewriting Class v0.3.2. It statically analyzes TypeScript/JavaScript source files at build time, extracts utility class calls (tw, cx, when), generates deterministic CSS class names and declarations, and replaces call sites with those names for zero-runtime CSS output. Released weekly. Key differentiators: Rust-based performance, strict mode requiring explicit dynamic() wrapping, and Solid.js plugin ordering requirement.","status":"active","version":"0.3.2","language":"javascript","source_language":"en","source_url":"https://github.com/corysimmons/typewritingclass","tags":["javascript","typewritingclass","compiler","vite-plugin","css","static-extraction","typescript"],"install":[{"cmd":"npm install typewritingclass-compiler","lang":"bash","label":"npm"},{"cmd":"yarn add typewritingclass-compiler","lang":"bash","label":"yarn"},{"cmd":"pnpm add typewritingclass-compiler","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"peer dependency for Vite plugin functionality","package":"vite","optional":false}],"imports":[{"note":"ESM-only since v0.1; no named default export, use import default.","wrong":"const twcPlugin = require('typewritingclass-compiler')","symbol":"twcPlugin","correct":"import twcPlugin from 'typewritingclass-compiler'"},{"note":"Named export, not default.","wrong":"import nativeTransform from 'typewritingclass-compiler'","symbol":"nativeTransform","correct":"import { nativeTransform } from 'typewritingclass-compiler'"},{"note":"TypeScript type only, cannot be required.","wrong":"const { ThemeInput } = require('typewritingclass-compiler')","symbol":"ThemeInput","correct":"import type { ThemeInput } from 'typewritingclass-compiler'"}],"quickstart":{"code":"// vite.config.ts\nimport { defineConfig } from 'vite'\nimport twcPlugin from 'typewritingclass-compiler'\nimport solid from 'vite-plugin-solid'\n\nexport default defineConfig({\n  plugins: [twcPlugin(), solid()],\n})\n\n// src/main.tsx\nimport 'virtual:twc.css'\nimport { tw } from 'typewritingclass'\n\nfunction App() {\n  return <div className={tw('bg-blue-500 text-white p-4')}>Hello</div>\n}","lang":"typescript","description":"Sets up Vite plugin with Solid.js, imports virtual CSS module, and uses `tw` from typewritingclass."},"warnings":[{"fix":"Ensure plugins order: [twcPlugin(), solid()]","message":"Solid.js plugin must come AFTER twcPlugin in the plugins array","severity":"gotcha","affected_versions":">=0.1.0"},{"fix":"Wrap dynamic values: tw(dynamic(expr)) or set strict: false in options","message":"Strict mode is enabled by default; dynamic values must be wrapped with dynamic()","severity":"breaking","affected_versions":">=0.2.0"},{"fix":"Add import 'virtual:twc.css' at the top of your main file","message":"virtual:twc.css must be imported in your entry file","severity":"gotcha","affected_versions":">=0.1.0"},{"fix":"Use import statements or set type: 'module' in package.json","message":"CommonJS require() is not supported; ESM-only","severity":"deprecated","affected_versions":">=0.1.0"}],"env_vars":null,"search_vec":"'analyz':20 'base':60 'build':25 'call':30,43 'class':16,29,37 'compil':3,10,75 'css':8,36,52,79 'cx':32 'declar':40 'determinist':35 'differenti':57 'dynam':66 'explicit':65 'extract':9,27,82 'file':23 'generat':34 'javascript':73 'key':56 'mode':63 'name':38,47 'order':71 'output':53 'perform':61 'plugin':13,70,78 'power':6 'releas':54 'replac':42 'requir':64,72 'runtim':51 'rust':5,59 'rust-bas':58 'rust-pow':4 'site':44 'solid.js':69 'sourc':22 'static':7,19,81 'static-extract':80 'strict':62 'time':26 'tw':31 'typescript':83 'typescript/javascript':21 'typewrit':15 'typewritingclass':2,74 'typewritingclass-compil':1 'util':28 'v0.3.2':17 'vite':12,77 'vite-plugin':76 'week':55 'wrap':67 'zero':50 'zero-runtim':49","created_at":"2026-05-01T13:50:36.794537+00:00","updated_at":"2026-05-01T13:50:36.794537+00:00","problems":[{"fix":"Add twcPlugin() to your Vite plugins array and restart the dev server.","cause":"Virtual module not registered because twcPlugin() is missing from Vite config","error":"Cannot find module 'virtual:twc.css'"},{"fix":"Use default import: import twcPlugin from 'typewritingclass-compiler'","cause":"Importing default export incorrectly (e.g., using named import)","error":"TypeError: twcPlugin is not a function"},{"fix":"Wrap the value: tw(dynamic(expr)) or disable strict mode with twcPlugin({ strict: false })","cause":"Strict mode enabled and a non-static value passed to tw()","error":"Error: Dynamic value must be wrapped with dynamic()"}],"ecosystem":"npm","meta_description":null,"install_score":null,"quickstart_score":null,"quickstart_tag":null,"pypi_latest":null,"cli_name":"","cli_version":null,"type":"library","homepage":null,"github":"https://github.com/corysimmons/typewritingclass","docs":null,"changelog":null,"pypi":null,"npm":"https://www.npmjs.com/package/typewritingclass-compiler","openapi_spec":null,"status_page":null,"smithery":null,"categories":["web-framework","devops"],"base_url":null,"auth_type":null,"provenance":{"verified_status":null,"verified_at":null,"last_verified":"2026-05-01","next_check":"2026-07-30","install_tag":null}}