Single File Component Compilation

/**
 * Parse Vue Single File Component source code
 * @param source - SFC source code string
 * @param options - Parse options
 * @returns Parsed SFC descriptor
 */
function parse(
  source: string,
  options?: SFCParseOptions
): SFCDescriptor;

interface SFCParseOptions {
  filename?: string;
  sourceMap?: boolean;
  sourceRoot?: string;
  pad?: boolean | 'line' | 'space';
  ignoreEmpty?: boolean;
  compiler?: TemplateCompiler;
}

interface SFCDescriptor {
  filename: string;
  source: string;
  template: SFCTemplateBlock | null;
  script: SFCScriptBlock | null;
  scriptSetup: SFCScriptBlock | null;
  styles: SFCStyleBlock[];
  customBlocks: SFCBlock[];
  cssVars: string[];
  slotted: boolean;
  shouldForceReload: (prevDescriptor: SFCDescriptor) => boolean;
}

import { parse } from "vue/compiler-sfc";

const sfcCode = `
<template>
  <div>{{ message }}</div>
</template>

<script setup>
import { ref } from 'vue'
const message = ref('Hello')
</script>

<style scoped>
div { color: red; }
</style>
`;

const { descriptor } = parse(sfcCode, {
  filename: 'App.vue'
});

console.log(descriptor.template?.content); // <div>{{ message }}</div>
console.log(descriptor.scriptSetup?.content); // import { ref } from 'vue'...

/**
 * Compile SFC template block to render function
 * @param options - Template compilation options
 * @returns Compilation result
 */
function compileTemplate(
  options: SFCTemplateCompileOptions
): SFCTemplateCompileResults;

interface SFCTemplateCompileOptions {
  source: string;
  filename: string;
  id: string;
  scoped?: boolean;
  slotted?: boolean;
  isProd?: boolean;
  ssr?: boolean;
  ssrCssVars?: string[];
  transformAssetUrls?: AssetURLOptions | boolean;
  compiler?: TemplateCompiler;
  compilerOptions?: CompilerOptions;
  preprocessLang?: string;
  preprocessOptions?: any;
  preprocessCustomRequire?: (id: string) => any;
  inMap?: RawSourceMap;
  sourceMap?: boolean;
  sourceRoot?: string;
}

interface SFCTemplateCompileResults {
  code: string;
  ast?: RootNode;
  preamble?: string;
  source: string;
  tips: string[];
  errors: (string | CompilerError)[];
  map?: RawSourceMap;
}

import { compileTemplate } from "vue/compiler-sfc";

const result = compileTemplate({
  source: '<div>{{ message }}</div>',
  filename: 'App.vue',
  id: 'app',
  compilerOptions: {
    mode: 'module'
  }
});

console.log(result.code); // Generated render function

/**
 * Compile SFC script block with setup and normal script support
 * @param sfc - SFC descriptor
 * @param options - Script compilation options
 * @returns Compiled script block
 */
function compileScript(
  sfc: SFCDescriptor,
  options: SFCScriptCompileOptions
): SFCScriptBlock;

interface SFCScriptCompileOptions {
  id: string;
  isProd?: boolean;
  inlineTemplate?: boolean;
  templateOptions?: Partial<SFCTemplateCompileOptions>;
  sourceMap?: boolean;
  genDefaultAs?: string;
  customElement?: boolean;
  defineModel?: boolean;
  propsDestructure?: boolean;
  fs?: {
    fileExists(file: string): boolean;
    readFile(file: string): string | undefined;
  };
  globalTypeFiles?: string[];
}

interface SFCScriptBlock extends SFCBlock {
  type: 'script';
  setup?: boolean;
  bindings?: BindingMetadata;
  imports?: Record<string, ImportBinding>;
  scriptAst?: Statement[];
  scriptSetupAst?: Statement[];
  warnings?: string[];
  deps?: string[];
}

import { parse, compileScript } from "vue/compiler-sfc";

const { descriptor } = parse(sfcSource);

const compiledScript = compileScript(descriptor, {
  id: 'app',
  inlineTemplate: true
});

console.log(compiledScript.content); // Compiled JavaScript code

/**
 * Compile SFC style block synchronously
 * @param options - Style compilation options
 * @returns Style compilation result
 */
function compileStyle(
  options: SFCStyleCompileOptions
): SFCStyleCompileResults;

/**
 * Compile SFC style block asynchronously
 * @param options - Style compilation options
 * @returns Promise resolving to style compilation result
 */
function compileStyleAsync(
  options: SFCAsyncStyleCompileOptions
): Promise<SFCStyleCompileResults>;

interface SFCStyleCompileOptions {
  source: string;
  filename: string;
  id: string;
  scoped?: boolean;
  modules?: boolean;
  modulesOptions?: CSSModulesOptions;
  preprocessLang?: string;
  preprocessOptions?: any;
  preprocessCustomRequire?: (id: string) => any;
  postcssOptions?: any;
  postcssPlugins?: any[];
  map?: RawSourceMap;
  isProd?: boolean;
  inMap?: RawSourceMap;
  sourceMap?: boolean;
  trim?: boolean;
}

interface SFCAsyncStyleCompileOptions extends SFCStyleCompileOptions {
  isAsync?: boolean;
  cleanCSS?: boolean;
}

interface SFCStyleCompileResults {
  code: string;
  map?: RawSourceMap;
  rawResult?: LazyResult | Result;
  errors: Error[];
  modules?: Record<string, string>;
  dependencies: Set<string>;
}

import { compileStyle } from "vue/compiler-sfc";

const result = compileStyle({
  source: `.red { color: red; }`,
  filename: 'App.vue',
  id: 'app',
  scoped: true
});

console.log(result.code); // Scoped CSS with data attributes

/**
 * Rewrite default export in script code
 * @param input - Input JavaScript code
 * @param as - Variable name for default export
 * @param parserPlugins - Babel parser plugins
 * @returns Rewritten code
 */
function rewriteDefault(
  input: string,
  as: string,
  parserPlugins?: ParserPlugin[]
): string;

/**
 * Generate formatted code frame for error display
 * @param source - Source code
 * @param start - Error start position
 * @param end - Error end position
 * @returns Formatted code frame
 */
function generateCodeFrame(
  source: string,
  start?: number,
  end?: number
): string;

/**
 * Resolve TypeScript type elements for props/emits inference
 * @param ctx - Script context
 * @param node - TypeScript node
 * @param scope - Type scope
 * @returns Resolved type elements
 */
function resolveTypeElements(
  ctx: TypeResolveContext,
  node: Node,
  scope?: TypeScope
): {
  props: Record<string, PropTypeData>;
  calls?: CallExpression[];
};

/**
 * Infer runtime type from TypeScript type annotation
 * @param ctx - Script context
 * @param node - TypeScript node
 * @param scope - Type scope
 * @returns Runtime type array
 */
function inferRuntimeType(
  ctx: TypeResolveContext,
  node: Node,
  scope?: TypeScope
): string[];

/**
 * Register TypeScript for type resolution
 * @returns TypeScript instance
 */
function registerTS(): typeof import('typescript');

/**
 * Invalidate type cache (useful for HMR)
 * @param filename - File to invalidate
 */
function invalidateTypeCache(filename: string): void;

interface VueLoaderOptions {
  hotReload?: boolean;
  productionMode?: boolean;
  shadowMode?: boolean;
  transformAssetUrls?: AssetURLOptions;
  appendExtension?: boolean;
  cacheDirectory?: string;
  cacheIdentifier?: string;
  sourceMap?: boolean;
  prettify?: boolean;
  optimizeSSR?: boolean;
  exposeFilename?: boolean;
  enableTsInTemplate?: boolean;
  compiler?: TemplateCompiler;
  compilerOptions?: CompilerOptions;
  transformAssetUrlsOptions?: {
    base?: string;
    includeAbsolute?: boolean;
    tags?: Record<string, string | string[]>;
  };
}

interface VitePluginVueOptions {
  include?: string | RegExp | (string | RegExp)[];
  exclude?: string | RegExp | (string | RegExp)[];
  isProduction?: boolean;
  script?: Partial<SFCScriptCompileOptions>;
  template?: Partial<SFCTemplateCompileOptions>;
  style?: Partial<SFCStyleCompileOptions>;
  customElement?: boolean | RegExp | (string | RegExp)[];
  reactivityTransform?: boolean;
  defineModel?: boolean;
  compiler?: TemplateCompiler;
}

/**
 * Rewrite default export in script
 * @param input - Input code string
 * @param as - Export name to rewrite as
 * @param parserPlugins - Babel parser plugins
 * @returns Transformed code
 */
function rewriteDefault(
  input: string, 
  as: string,
  parserPlugins?: ParserPlugin[]
): string;

/**
 * Rewrite default export in AST
 * @param ast - Babel AST
 * @param as - Export name to rewrite as
 * @returns Transformed AST
 */
function rewriteDefaultAST(
  ast: Statement[], 
  as: string
): Statement[];

/**
 * Generate code frame for error reporting
 * @param source - Source code
 * @param start - Start position
 * @param end - End position (optional)
 * @returns Formatted code frame
 */
function generateCodeFrame(
  source: string,
  start?: number,
  end?: number
): string;

/**
 * Walk identifiers in AST node
 * @param root - AST node to walk
 * @param onIdentifier - Callback for each identifier
 * @param includeAll - Include all identifiers
 * @param parentStack - Parent node stack
 * @param knownIds - Known identifier set
 */
function walkIdentifiers(
  root: Node,
  onIdentifier: (node: Identifier, parent: Node, parentStack: Node[]) => void,
  includeAll?: boolean,
  parentStack?: Node[],
  knownIds?: Set<string>
): void;

/**
 * Extract identifiers from AST node
 * @param param - AST node (parameter, pattern, etc.)
 * @param nodes - Optional array to collect nodes
 * @returns Set of identifier names
 */
function extractIdentifiers(
  param: Node,
  nodes?: Identifier[]
): Set<string>;

/**
 * Resolve type elements from TypeScript type annotation
 * @param ctx - Type resolution context
 * @param node - TypeScript type node
 * @returns Resolved type elements
 */
function resolveTypeElements(
  ctx: TypeResolveContext,
  node: TSType
): ResolvedElements;

/**
 * Infer runtime type from TypeScript type
 * @param ctx - Type resolution context
 * @param node - TypeScript type node
 * @param scope - Type scope
 * @returns Runtime type information
 */
function inferRuntimeType(
  ctx: TypeResolveContext,
  node: TSType,
  scope?: TypeScope
): RuntimeTypeInfo;

interface ResolvedElements {
  properties: Record<string, ResolvedProperty>;
  calls: ResolvedCall[];
}

interface ResolvedProperty {
  type: string;
  required: boolean;
  key: string;
}

interface ResolvedCall {
  type: string;
  params: ResolvedParam[];
}

interface ResolvedParam {
  name: string;
  type: string;
  optional: boolean;
}

interface RuntimeTypeInfo {
  type: string;
  elements?: ResolvedElements;
  params?: ResolvedParam[];
}

interface SFCBlock {
  type: string;
  content: string;
  attrs: Record<string, string | true>;
  loc: SourceLocation;
  map?: RawSourceMap;
  lang?: string;
  src?: string;
}

interface SFCTemplateBlock extends SFCBlock {
  type: 'template';
  ast?: RootNode;
}

interface SFCScriptBlock extends SFCBlock {
  type: 'script';
  setup?: boolean;
  bindings?: BindingMetadata;
  imports?: Record<string, ImportBinding>;
  scriptAst?: Statement[];
  scriptSetupAst?: Statement[];
}

interface SFCStyleBlock extends SFCBlock {
  type: 'style';
  scoped?: boolean;
  module?: string | boolean;
}

interface BindingMetadata {
  [key: string]: BindingTypes;
}

enum BindingTypes {
  DATA = 'data',
  PROPS = 'props',
  SETUP_CONST = 'setup-const',
  SETUP_REACTIVE_CONST = 'setup-reactive-const',
  SETUP_LET = 'setup-let',
  SETUP_REF = 'setup-ref',
  SETUP_MAYBE_REF = 'setup-maybe-ref',
  LITERAL_CONST = 'literal-const'
}

interface ImportBinding {
  isType: boolean;
  imported: string;
  local: string;
  source: string;
  isFromSetup: boolean;
  isUsedInTemplate: boolean;
}

interface TypeResolveContext {
  filename: string;
  source: string;
  scope?: TypeScope;
  globalScopes?: TypeScope[];
  deps?: Set<string>;
  options: SFCScriptCompileOptions;
}

interface PropTypeData {
  key: string;
  type: string[];
  required: boolean;
  skipCheck: boolean;
}