tessl/npm-vue--compiler-ssr

Vue.js server-side rendering compiler that transforms Vue templates into optimized render functions for server-side execution

—

Pending

Overview

Eval results

Files

Error Handling

Name: tessl/npm-vue--compiler-ssr
Author: tessl

SSR-specific error handling system with dedicated error codes and messages for compilation issues unique to server-side rendering contexts.

Capabilities

SSR Error Codes

Enumeration of error codes specific to SSR compilation issues that extend the base compiler error codes.

enum SSRErrorCodes {
  /** Unsafe attribute name detected during SSR compilation */
  X_SSR_UNSAFE_ATTR_NAME = 65,
  /** Teleport component missing required 'to' prop */
  X_SSR_NO_TELEPORT_TARGET,
  /** Invalid AST node encountered during SSR transformation */
  X_SSR_INVALID_AST_NODE,
}

SSR Compiler Error Interface

Extended compiler error interface that includes SSR-specific error codes.

interface SSRCompilerError extends CompilerError {
  /** SSR-specific error code */
  code: SSRErrorCodes;
}

Error Creation Function

Factory function for creating SSR-specific compiler errors with appropriate error codes and location information.

/**
 * Creates SSR-specific compiler errors with appropriate error codes
 * @param code - SSR error code indicating the type of error
 * @param loc - Optional source location where the error occurred
 * @returns SSRCompilerError instance with SSR-specific error information
 */
function createSSRCompilerError(
  code: SSRErrorCodes,
  loc?: SourceLocation
): SSRCompilerError;

Error Messages

Human-readable error messages corresponding to each SSR error code.

/**
 * Mapping of SSR error codes to human-readable error messages
 * Used for displaying meaningful error information to developers
 */
const SSRErrorMessages: { [code: number]: string };

The SSRErrorMessages object contains the following mappings:

X_SSR_UNSAFE_ATTR_NAME → "Unsafe attribute name for SSR."
X_SSR_NO_TELEPORT_TARGET → "Missing the 'to' prop on teleport element."
X_SSR_INVALID_AST_NODE → "Invalid AST node during SSR transform."

Error Categories

Attribute Safety Errors

X_SSR_UNSAFE_ATTR_NAME: Indicates an attribute name that is unsafe for server-side rendering.

Common causes:

Attribute names containing characters that could cause XSS vulnerabilities
Attribute names that conflict with SSR rendering logic
Malformed or potentially dangerous attribute names

// Example usage in transform code
if (isUnsafeAttrName(attrName)) {
  context.onError(createSSRCompilerError(
    SSRErrorCodes.X_SSR_UNSAFE_ATTR_NAME,
    attr.loc
  ));
}

Component Configuration Errors

X_SSR_NO_TELEPORT_TARGET: Indicates a teleport component is missing its required 'to' prop.

Common causes:

<teleport> element without a to attribute
Dynamic to prop that cannot be resolved at compile time
Invalid teleport target specification

// Example usage in teleport transform
if (!hasToProp(teleportNode)) {
  context.onError(createSSRCompilerError(
    SSRErrorCodes.X_SSR_NO_TELEPORT_TARGET,
    teleportNode.loc
  ));
}

AST Processing Errors

X_SSR_INVALID_AST_NODE: Indicates an invalid or unexpected AST node during SSR transformation.

Common causes:

Malformed template AST nodes
Unsupported node types in SSR context
Corrupted AST structure during transformation

// Example usage in transform processing
if (!isSupportedNodeType(node)) {
  context.onError(createSSRCompilerError(
    SSRErrorCodes.X_SSR_INVALID_AST_NODE,
    node.loc
  ));
}

Error Handling Best Practices

Error Context

Always provide source location information when creating errors to help developers identify the exact location of issues in their templates:

// Good: Include location information
context.onError(createSSRCompilerError(
  SSRErrorCodes.X_SSR_UNSAFE_ATTR_NAME,
  attr.loc
));

// Less helpful: No location information
context.onError(createSSRCompilerError(
  SSRErrorCodes.X_SSR_UNSAFE_ATTR_NAME
));

Error Recovery

The SSR compiler attempts to recover from errors when possible, allowing compilation to continue and report multiple issues:

// Transform continues after error reporting
try {
  processUnsafeAttribute(attr, context);
} catch (error) {
  context.onError(createSSRCompilerError(
    SSRErrorCodes.X_SSR_UNSAFE_ATTR_NAME,
    attr.loc
  ));
  // Continue processing other attributes
}

Custom Error Handling

Developers can provide custom error handlers through compiler options:

import { compile } from "@vue/compiler-ssr";

const result = compile(template, {
  onError: (error) => {
    if (error.code === SSRErrorCodes.X_SSR_UNSAFE_ATTR_NAME) {
      // Custom handling for unsafe attribute names
      console.warn(`Unsafe attribute detected: ${error.message}`);
    } else {
      // Default error handling
      throw error;
    }
  }
});

Error Code Extension

The SSR error codes extend the base DOMErrorCodes from @vue/compiler-dom starting at the extension point (65). This ensures no conflicts with existing error codes while maintaining consistency with the broader Vue compiler error system.

// Error code numbering starts after DOMErrorCodes extension point
if (__TEST__) {
  if (SSRErrorCodes.X_SSR_UNSAFE_ATTR_NAME < DOMErrorCodes.__EXTEND_POINT__) {
    throw new Error(
      `SSRErrorCodes need to be updated to match extension point from core DOMErrorCodes.`
    );
  }
}

Install with Tessl CLI