or run

npx @tessl/cli init
Log in

Version

Tile

Overview

Evals

Files

docs

examples

edge-cases.mdreal-world-scenarios.md

guides

quick-start.md

reference

configuration.mdcore-types.mdenvironment-variables.mdenvironment.mderror-handling.mdforms.mdload-functions.mdnavigation-lifecycle.mdnavigation.mdnodejs-polyfills.mdnodejs.mdpaths.mdremote-functions.mdrequest-response.mdserver-hooks.mdserver-utilities.mdservice-worker.mdstate-stores.mdvite-plugin.md
index.md
tile.json

environment.mddocs/reference/

Environment

Detect runtime environment with boolean flags for browser, dev mode, building, and app version.

Capabilities

Environment Constants

// From '$app/environment'
const browser: boolean;
const dev: boolean;
const building: boolean;
const version: string;

Usage:

import { browser, dev, building, version } from '$app/environment';

// Browser-only code
if (browser) {
  localStorage.setItem('key', 'value');
  window.addEventListener('resize', handleResize);
}

// Dev-only logging
if (dev) {
  console.log('Debug info:', data);
}

// Skip expensive operations during build
if (!building) {
  await connectToDatabase();
}

// Display version
console.log('App version:', version);

Conditional Execution:

<script>
  import { browser, dev } from '$app/environment';

  // Only runs in browser
  $: if (browser) {
    document.title = pageTitle;
  }

  // Dev-only features
  {#if dev}
    <DebugPanel />
  {/if}
</script>

Notes

  • browser: true in browser, false during SSR
  • dev: true when running dev server (npm run dev)
  • building: true during vite build and prerendering
  • version: String from config.kit.version.name (empty string if not set)
  • Use browser to gate browser-only APIs (localStorage, window, document)
  • Use dev for development-only features and logging
  • Use building to skip operations during build (database connections, etc.)
  • All values are replaced at build time (dead code elimination)