@gluonjs/compiler / packages/compiler/src / GluonSourceMap

Interface: GluonSourceMap

Properties

file

file: string

mappings

mappings: string

names

names: string[]

sources

sources: string[]

sourcesContent?

optional sourcesContent?: string[]

version

version: number

Example

Pass the generated source map from the Gluon transform into Vite or another downstream build tool:

import {
  transformGluonModule,
  transpileGluonDecorators,
  type GluonCompilerDiagnostic,
  type GluonDecoratorMode,
  type GluonSourceMap,
  type GluonTemplateLocation,
  type GluonTemplatePart,
  type GluonTemplateTag,
  type GluonTransformOptions,
  type GluonTransformResult,
  type GluonTranspileResult,
  type SourceLocation,
} from '@gluonjs/compiler';

const source = `
  import { html } from '@gluonjs/core';
  export const Product = (name: string) => html\`<h1>\${name}</h1>\`;
`;
const options = { development: true } satisfies GluonTransformOptions;
const result: GluonTransformResult = transformGluonModule(source, '/src/product.ts', options);
const map: GluonSourceMap = result.map;
const template: GluonTemplateLocation | undefined = result.templates[0];
const tag: GluonTemplateTag | undefined = template?.tag;
const part: GluonTemplatePart | undefined = template?.parts[0];
const start: SourceLocation | undefined = part?.start;
const diagnostic: GluonCompilerDiagnostic | undefined = result.diagnostics[0];
const mode: GluonDecoratorMode = 'standard';
const transpiled: GluonTranspileResult = transpileGluonDecorators(result.code, '/src/product.ts', mode);
console.log(result.code, transpiled.code, map.sources, tag, start, diagnostic?.message, result.hmr);