{"id":26500,"library":"transp","title":"Transp","description":"Transp is a client-side transpilation library that transparently transpiles TypeScript, JSX, and other modern JavaScript dialects directly in the browser using Babel Standalone, without requiring Node.js or a build step. Current stable version is 0.0.4. It provides a JavaScript API with drop-in replacements for dynamic import() and eval(), as well as a custom HTML element for inline or external scripts. Released with an irregular cadence as it is primarily a proof-of-concept for development/debugging, not production use due to large bundle size. Key differentiators: no build tooling needed, uses full Babel Standalone, supports custom presets/plugins, and enables external library loading via CDN.","status":"active","version":"0.0.4","language":"javascript","source_language":"en","source_url":"ssh://git@github.com/noamr/transp","tags":["javascript","typescript"],"install":[{"cmd":"npm install transp","lang":"bash","label":"npm"},{"cmd":"yarn add transp","lang":"bash","label":"yarn"},{"cmd":"pnpm add transp","lang":"bash","label":"pnpm"}],"dependencies":[],"imports":[{"note":"The 'import' function is a named export, not default. Since 'import' is a reserved word, you must alias it or use a different name.","wrong":"import transp from 'transp'","symbol":"import","correct":"import { import as transpImport } from 'transp'"},{"note":"The 'eval' function is a named export, aliasing is required because 'eval' is a reserved word. In ESM, import { eval } causes a SyntaxError.","wrong":"const eval = require('transp').eval","symbol":"eval","correct":"import { eval as transpEval } from 'transp'"},{"note":"configure is a named export. The package exports only named symbols; there is no default export.","wrong":"import configure = require('transp').configure","symbol":"configure","correct":"import { configure } from 'transp'"},{"note":"Both ESM and CJS work, but CJS is not recommended for browser usage. The function registers a custom element in the DOM.","wrong":"const { initCustomElement } = require('transp')","symbol":"initCustomElement","correct":"import { initCustomElement } from 'transp'"}],"quickstart":{"code":"\n\n\n \n Transp Quickstart\n\n\n \n\n \n \n const greeting: string = 'Hello, World!';\n console.log(greeting as string);\n \n\n","lang":"typescript","description":"This example shows how to use Transp in a browser environment: importing the ESM bundle, dynamic import of a TypeScript file, inline evaluation with TypeScript, and the custom element."},"warnings":[{"fix":"Only use for development or debugging; not suitable for production. Consider server-side transpilation or smaller alternatives like esbuild.","message":"Transp downloads the full Babel Standalone bundle (~2.5 MB) on first use, which is heavy and may cause long load times.","severity":"gotcha","affected_versions":"*"},{"fix":"Always alias the import when using in a module environment: import { import as transpImport } from 'transp'.","message":"The 'import' function built into Transp overrides window.import if called without aliasing, causing collisions with standard dynamic import in older browsers.","severity":"gotcha","affected_versions":"*"},{"fix":"Use the JavaScript API or ensure scripts are independent.","message":"The custom element does not execute synchronously; it behaves like