Svelte Code Checker Terminal Interface that provides CLI diagnostics for unused CSS, Svelte A11y hints, and JavaScript/TypeScript compiler errors
npx @tessl/cli install tessl/npm-svelte-check@4.0.0Svelte Check is a command-line tool that provides comprehensive diagnostics for Svelte applications, detecting unused CSS, Svelte accessibility hints, and JavaScript/TypeScript compiler errors. It integrates with TypeScript configuration files and offers flexible output formats for both human consumption and machine processing in CI/CD pipelines.
npm install svelte-check --save-devSvelte Check is primarily used as a CLI tool via the binary:
# Global installation
npm install -g svelte-check
svelte-check
# Local installation (recommended)
npm install svelte-check --save-dev
npx svelte-checkFor programmatic usage in build scripts:
// Import for programmatic usage (advanced)
import { exec } from 'child_process';
import { promisify } from 'util';
const execAsync = promisify(exec);
// Run svelte-check programmatically
const { stdout, stderr } = await execAsync('svelte-check --output machine');Add to your package.json scripts:
{
"scripts": {
"svelte-check": "svelte-check"
}
}Run basic check:
npm run svelte-checkWith configuration options:
svelte-check --workspace ./src --output machine --tsconfig ./tsconfig.json// Run svelte-check programmatically via child process
import { spawn } from 'child_process';
function runSvelteCheck(options: string[] = []): Promise<{
stdout: string;
stderr: string;
exitCode: number;
}> {
return new Promise((resolve) => {
const child = spawn('svelte-check', options);
let stdout = '';
let stderr = '';
child.stdout.on('data', (data) => stdout += data);
child.stderr.on('data', (data) => stderr += data);
child.on('close', (exitCode) => {
resolve({ stdout, stderr, exitCode: exitCode || 0 });
});
});
}
// Usage
const result = await runSvelteCheck(['--workspace', './src', '--output', 'machine']);
if (result.exitCode === 0) {
console.log('No issues found');
} else {
console.log('Issues found:', result.stdout);
}Svelte Check is built on top of the Svelte Language Server and integrates several key components:
The primary interface for checking Svelte projects from the command line with extensive configuration options.
svelte-check [options]Available Options:
--workspace <path> - Path to workspace directory (default: current working directory)--output <format> - Output format: human, human-verbose, machine, machine-verbose (default: human-verbose)--watch - Watch mode for continuous checking--preserveWatchOutput - Don't clear screen in watch mode--tsconfig <path> - Path to tsconfig or jsconfig file--no-tsconfig - Only check Svelte files, ignore JS/TS files--ignore <paths> - Files/folders to ignore, relative to workspace root, comma-separated, inside quotes (only with --no-tsconfig)--fail-on-warnings - Exit with error code when warnings are found--compiler-warnings <codes> - Configure Svelte compiler warning levels--diagnostic-sources <sources> - Limit diagnostic sources: js,svelte,css--threshold <level> - Filter diagnostics: error, warning--color - Force enable color output--no-color - Force disable color outputUsage Examples:
# Basic check
svelte-check
# Check specific workspace with TypeScript config
svelte-check --workspace ./src --tsconfig ./tsconfig.json
# Machine-readable output for CI
svelte-check --output machine --fail-on-warnings
# Watch mode with custom ignore patterns
svelte-check --watch --ignore "dist,build" --no-tsconfig
# Configure compiler warnings
svelte-check --compiler-warnings "css-unused-selector:ignore,unused-export-let:error"
# Filter diagnostic sources
svelte-check --diagnostic-sources "js,svelte" --threshold errorFor build tool integration and programmatic usage via child process execution.
/**
* Run svelte-check programmatically
* @param args - Command line arguments array
* @returns Promise resolving to execution result
*/
function runSvelteCheck(args: string[]): Promise<SvelteCheckResult>;
/**
* Result of svelte-check execution
*/
interface SvelteCheckResult {
/** Standard output from svelte-check */
stdout: string;
/** Standard error output */
stderr: string;
/** Exit code (0 for success, 1 for errors/warnings) */
exitCode: number;
}
/**
* Parse machine-readable output from svelte-check
* @param output - Machine format output string
* @returns Parsed diagnostic results
*/
function parseMachineOutput(output: string): ParsedDiagnostic[];
/**
* Parsed diagnostic from machine output
*/
interface ParsedDiagnostic {
/** Diagnostic type */
type: 'ERROR' | 'WARNING';
/** File path relative to workspace */
filename: string;
/** Line number (1-based) */
line: number;
/** Character position (1-based) */
character: number;
/** Diagnostic message */
message: string;
/** Diagnostic timestamp */
timestamp: number;
}
/**
* Individual diagnostic issue (from language server protocol)
*/
interface Diagnostic {
/** Source location range */
range: Range;
/** Issue severity level */
severity: DiagnosticSeverity;
/** Human-readable error message */
message: string;
/** Error/warning code */
code?: number | string;
/** Diagnostic source (e.g., "svelte", "typescript") */
source?: string;
/** Additional diagnostic tags */
tags?: DiagnosticTag[];
}
/**
* Position range in source code
*/
interface Range {
start: Position;
end: Position;
}
/**
* Line and character position
*/
interface Position {
/** Zero-based line number */
line: number;
/** Zero-based character offset */
character: number;
}
/**
* Diagnostic tag for additional metadata
*/
interface DiagnosticTag {
/** Tag type identifier */
type: number;
}Customizable output formatting for different consumption needs.
/**
* Base interface for diagnostic output writers
*/
interface Writer {
/** Initialize writer with workspace directory */
start(workspaceDir: string): void;
/** Write diagnostics for a single file */
file(diagnostics: Diagnostic[], workspaceDir: string, filename: string, text: string): void;
/** Write completion summary */
completion(fileCount: number, errorCount: number, warningCount: number, fileCountWithProblems: number): void;
/** Write failure message */
failure(err: Error): void;
}
/**
* Human-readable console output writer
*/
class HumanFriendlyWriter implements Writer {
constructor(
stream: Writable,
isVerbose?: boolean,
isWatchMode?: boolean,
clearScreen?: boolean,
diagnosticFilter?: DiagnosticFilter
);
}
/**
* Machine-readable structured output writer
*/
class MachineFriendlyWriter implements Writer {
constructor(
stream: Writable,
isVerbose?: boolean,
diagnosticFilter?: DiagnosticFilter
);
}
/**
* Function to filter which diagnostics to include in output
*/
type DiagnosticFilter = (diagnostic: Diagnostic) => boolean;
/** Default filter that includes all diagnostics */
const DEFAULT_FILTER: DiagnosticFilter;Internal option parsing functionality for command-line interface.
/**
* Parsed CLI options structure
*/
interface SvelteCheckCliOptions {
/** Workspace URI object */
workspaceUri: URI;
/** Selected output format */
outputFormat: OutputFormat;
/** Watch mode enabled */
watch: boolean;
/** Preserve output in watch mode */
preserveWatchOutput: boolean;
/** TypeScript config file path */
tsconfig?: string;
/** File paths to ignore */
filePathsToIgnore: string[];
/** Fail on warnings flag */
failOnWarnings: boolean;
/** Compiler warning configuration */
compilerWarnings: Record<string, 'error' | 'ignore'>;
/** Enabled diagnostic sources */
diagnosticSources: DiagnosticSource[];
/** Diagnostic threshold level */
threshold: Threshold;
}/** Supported output formats */
type OutputFormat = "human" | "human-verbose" | "machine" | "machine-verbose";
/** Available diagnostic sources */
type SvelteCheckDiagnosticSource = "js" | "css" | "svelte";
/** Diagnostic source type alias */
type DiagnosticSource = "js" | "css" | "svelte";
/** Diagnostic threshold levels */
type Threshold = "warning" | "error";
/** Diagnostic severity levels */
enum DiagnosticSeverity {
Error = 1,
Warning = 2,
Information = 3,
Hint = 4
}
/** URI class for file system paths */
class URI {
static file(path: string): URI;
readonly fsPath: string;
toString(): string;
}Svelte Check reports various types of issues:
JavaScript/TypeScript Errors:
Svelte Component Errors:
CSS Errors:
Configuration Errors:
--output machine)Timestamp-prefixed space-separated format:
1590680325583 START "/path/to/workspace"
1590680326283 ERROR "component.svelte" 1:16 "Type error message"
1590680326778 WARNING "component.svelte" 0:37 "Warning message"
1590680326807 COMPLETED 20 FILES 21 ERRORS 1 WARNINGS 3 FILES_WITH_PROBLEMS--output machine-verbose)Timestamp-prefixed JSON format:
1590680326283 {"type":"ERROR","filename":"component.svelte","start":{"line":1,"character":16},"end":{"line":1,"character":23},"message":"Type error message","code":2307,"source":"js"}
1590680326778 {"type":"WARNING","filename":"component.svelte","start":{"line":0,"character":37},"end":{"line":0,"character":51},"message":"Warning message","code":"unused-export-let","source":"svelte"}# Exit with error code on any issues
svelte-check --output machine --fail-on-warnings
# Check only errors for faster CI
svelte-check --threshold error --diagnostic-sources "js,svelte"import { exec } from 'child_process';
import { promisify } from 'util';
const execAsync = promisify(exec);
export async function runSvelteCheck(workspacePath: string) {
try {
const { stdout, stderr } = await execAsync(
`svelte-check --workspace "${workspacePath}" --output machine --fail-on-warnings`
);
console.log('Svelte check passed');
return { success: true, output: stdout };
} catch (error: any) {
console.error('Svelte check failed:', error.stdout || error.message);
throw new Error('Svelte check failed with errors');
}
}// Watch mode via CLI in a separate process
const watcher = spawn('svelte-check', ['--watch', '--workspace', workspacePath]);
watcher.stdout.on('data', (data) => {
console.log('Diagnostics updated:', data.toString());
});
watcher.on('close', (code) => {
console.log('Watch mode ended with code:', code);
});