Back to Qwik

@builder.io/qwik/optimizer API Reference

packages/docs/src/routes/api/qwik-optimizer/index.mdx

1.7.141.4 KB
Original Source

API › @builder.io/qwik/optimizer

<h2 id="path-basename">basename</h2>
typescript
basename(path: string, ext?: string): string;
<table><thead><tr><th>

Parameter

</th><th>

Type

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

path

</td><td>

string

</td><td> </td></tr> <tr><td>

ext

</td><td>

string

</td><td>

(Optional)

</td></tr> </tbody></table>

Returns:

string

<h2 id="bundlegraphadder">BundleGraphAdder</h2>

A function that returns a map of bundle names to their dependencies.

typescript
export type BundleGraphAdder = (manifest: QwikManifest) => Record<
  string,
  {
    imports?: string[];
    dynamicImports?: string[];
  }
>;

References: QwikManifest

Edit this section

<h2 id="componententrystrategy">ComponentEntryStrategy</h2>
typescript
export interface ComponentEntryStrategy
<table><thead><tr><th>

Property

</th><th>

Modifiers

</th><th>

Type

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

manual?

</td><td> </td><td>

Record<string, string>

</td><td>

(Optional)

</td></tr> <tr><td>

type

</td><td> </td><td>

'component'

</td><td> </td></tr> </tbody></table>

Edit this section

<h2 id="createoptimizer">createOptimizer</h2>
typescript
createOptimizer: (optimizerOptions?: OptimizerOptions) => Promise<Optimizer>;
<table><thead><tr><th>

Parameter

</th><th>

Type

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

optimizerOptions

</td><td>

OptimizerOptions

</td><td>

(Optional)

</td></tr> </tbody></table>

Returns:

Promise<Optimizer>

Edit this section

<h2 id="diagnostic">Diagnostic</h2>
typescript
export interface Diagnostic
<table><thead><tr><th>

Property

</th><th>

Modifiers

</th><th>

Type

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

category

</td><td> </td><td>

DiagnosticCategory

</td><td> </td></tr> <tr><td>

code

</td><td> </td><td>

string | null

</td><td> </td></tr> <tr><td>

file

</td><td> </td><td>

string

</td><td> </td></tr> <tr><td>

highlights

</td><td> </td><td>

SourceLocation[]

</td><td> </td></tr> <tr><td>

message

</td><td> </td><td>

string

</td><td> </td></tr> <tr><td>

scope

</td><td> </td><td>

string

</td><td> </td></tr> <tr><td>

suggestions

</td><td> </td><td>

string[] | null

</td><td> </td></tr> </tbody></table>

Edit this section

<h2 id="diagnosticcategory">DiagnosticCategory</h2>
typescript
export type DiagnosticCategory = "error" | "warning" | "sourceError";

Edit this section

<h2 id="path-dirname">dirname</h2>
typescript
dirname(path: string): string;
<table><thead><tr><th>

Parameter

</th><th>

Type

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

path

</td><td>

string

</td><td> </td></tr> </tbody></table>

Returns:

string

<h2 id="experimentalfeatures-enablerequestrewrite">enableRequestRewrite</h2> <h2 id="entrystrategy">EntryStrategy</h2>
typescript
export type EntryStrategy =
  | InlineEntryStrategy
  | HoistEntryStrategy
  | SingleEntryStrategy
  | HookEntryStrategy
  | SegmentEntryStrategy
  | ComponentEntryStrategy
  | SmartEntryStrategy;

References: InlineEntryStrategy, SingleEntryStrategy, SegmentEntryStrategy, ComponentEntryStrategy, SmartEntryStrategy

Edit this section

<h2 id="experimentalfeatures">ExperimentalFeatures</h2>

This API is provided as an alpha preview for developers and may change based on feedback that we receive. Do not use this API in a production environment.

Use __EXPERIMENTAL__.x to check if feature x is enabled. It will be replaced with true or false via an exact string replacement.

Add experimental features to this enum definition.

typescript
export declare enum ExperimentalFeatures
<table><thead><tr><th>

Member

</th><th>

Value

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

enableRequestRewrite

</td><td>

"enableRequestRewrite"

</td><td>

(ALPHA) Enable request.rewrite()

</td></tr> <tr><td>

noSPA

</td><td>

"noSPA"

</td><td>

(ALPHA) Disable SPA navigation handler in Qwik City

</td></tr> <tr><td>

preventNavigate

</td><td>

"preventNavigate"

</td><td>

(ALPHA) Enable the usePreventNavigate hook

</td></tr> <tr><td>

valibot

</td><td>

"valibot"

</td><td>

(ALPHA) Enable the Valibot form validation

</td></tr> </tbody></table>

Edit this section

<h2 id="path-extname">extname</h2>
typescript
extname(path: string): string;
<table><thead><tr><th>

Parameter

</th><th>

Type

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

path

</td><td>

string

</td><td> </td></tr> </tbody></table>

Returns:

string

<h2 id="path-format">format</h2>
typescript
format(pathObject: {
        root: string;
        dir: string;
        base: string;
        ext: string;
        name: string;
    }): string;
<table><thead><tr><th>

Parameter

</th><th>

Type

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

pathObject

</td><td>

{ root: string; dir: string; base: string; ext: string; name: string; }

</td><td> </td></tr> </tbody></table>

Returns:

string

<h2 id="globalinjections">GlobalInjections</h2>
typescript
export interface GlobalInjections
<table><thead><tr><th>

Property

</th><th>

Modifiers

</th><th>

Type

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

attributes?

</td><td> </td><td>

{ [key: string]: string; }

</td><td>

(Optional)

</td></tr> <tr><td>

location

</td><td> </td><td>

'head' | 'body'

</td><td> </td></tr> <tr><td>

tag

</td><td> </td><td>

string

</td><td> </td></tr> </tbody></table>

Edit this section

<h2 id="inlineentrystrategy">InlineEntryStrategy</h2>
typescript
export interface InlineEntryStrategy
<table><thead><tr><th>

Property

</th><th>

Modifiers

</th><th>

Type

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

type

</td><td> </td><td>

'inline'

</td><td> </td></tr> </tbody></table>

Edit this section

<h2 id="path-isabsolute">isAbsolute</h2>
typescript
isAbsolute(path: string): boolean;
<table><thead><tr><th>

Parameter

</th><th>

Type

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

path

</td><td>

string

</td><td> </td></tr> </tbody></table>

Returns:

boolean

<h2 id="path-join">join</h2>
typescript
join(...paths: string[]): string;
<table><thead><tr><th>

Parameter

</th><th>

Type

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

paths

</td><td>

string[]

</td><td> </td></tr> </tbody></table>

Returns:

string

<h2 id="minifymode">MinifyMode</h2>
typescript
export type MinifyMode = "simplify" | "none";

Edit this section

<h2 id="path-normalize">normalize</h2>
typescript
normalize(path: string): string;
<table><thead><tr><th>

Parameter

</th><th>

Type

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

path

</td><td>

string

</td><td> </td></tr> </tbody></table>

Returns:

string

<h2 id="experimentalfeatures-nospa">noSPA</h2> <h2 id="optimizer">Optimizer</h2>
typescript
export interface Optimizer
<table><thead><tr><th>

Property

</th><th>

Modifiers

</th><th>

Type

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

sys

</td><td> </td><td>

OptimizerSystem

</td><td>

Optimizer system use. This can be updated with a custom file system.

</td></tr> </tbody></table> <table><thead><tr><th>

Method

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

transformFs(opts)

</td><td>

Transforms the directory from the file system.

</td></tr> <tr><td>

transformFsSync(opts)

</td><td>

Transforms the directory from the file system.

</td></tr> <tr><td>

transformModules(opts)

</td><td>

Transforms the input code string, does not access the file system.

</td></tr> <tr><td>

transformModulesSync(opts)

</td><td>

Transforms the input code string, does not access the file system.

</td></tr> </tbody></table>

Edit this section

<h2 id="optimizeroptions">OptimizerOptions</h2>
typescript
export interface OptimizerOptions
<table><thead><tr><th>

Property

</th><th>

Modifiers

</th><th>

Type

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

binding?

</td><td> </td><td>

any

</td><td>

(Optional)

</td></tr> <tr><td>

inlineStylesUpToBytes?

</td><td> </td><td>

number

</td><td>

(Optional) Inline the global styles if they're smaller than this

</td></tr> <tr><td>

sourcemap?

</td><td> </td><td>

boolean

</td><td>

(Optional) Enable sourcemaps

</td></tr> <tr><td>

sys?

</td><td> </td><td>

OptimizerSystem

</td><td>

(Optional)

</td></tr> </tbody></table>

Edit this section

<h2 id="optimizersystem">OptimizerSystem</h2>
typescript
export interface OptimizerSystem
<table><thead><tr><th>

Property

</th><th>

Modifiers

</th><th>

Type

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

cwd

</td><td> </td><td>

() => string

</td><td> </td></tr> <tr><td>

dynamicImport

</td><td> </td><td>

(path: string) => Promise<any>

</td><td> </td></tr> <tr><td>

env

</td><td> </td><td>

SystemEnvironment

</td><td> </td></tr> <tr><td>

getInputFiles?

</td><td> </td><td>

(rootDir: string) => Promise<TransformModuleInput[]>

</td><td>

(Optional)

</td></tr> <tr><td>

os

</td><td> </td><td>

string

</td><td> </td></tr> <tr><td>

path

</td><td> </td><td>

Path

</td><td> </td></tr> <tr><td>

strictDynamicImport

</td><td> </td><td>

(path: string) => Promise<any>

</td><td> </td></tr> </tbody></table>

Edit this section

<h2 id="path-parse">parse</h2>
typescript
parse(path: string): {
        root: string;
        dir: string;
        base: string;
        ext: string;
        name: string;
    };
<table><thead><tr><th>

Parameter

</th><th>

Type

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

path

</td><td>

string

</td><td> </td></tr> </tbody></table>

Returns:

{ root: string; dir: string; base: string; ext: string; name: string; }

<h2 id="path">Path</h2>
typescript
export interface Path
<table><thead><tr><th>

Property

</th><th>

Modifiers

</th><th>

Type

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

delimiter

</td><td>

readonly

</td><td>

string

</td><td> </td></tr> <tr><td>

posix

</td><td>

readonly

</td><td>

Path

</td><td> </td></tr> <tr><td>

sep

</td><td>

readonly

</td><td>

string

</td><td> </td></tr> <tr><td>

win32

</td><td>

readonly

</td><td>

null

</td><td> </td></tr> </tbody></table> <table><thead><tr><th>

Method

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

basename(path, ext)

</td><td> </td></tr> <tr><td>

dirname(path)

</td><td> </td></tr> <tr><td>

extname(path)

</td><td> </td></tr> <tr><td>

format(pathObject)

</td><td> </td></tr> <tr><td>

isAbsolute(path)

</td><td> </td></tr> <tr><td>

join(paths)

</td><td> </td></tr> <tr><td>

normalize(path)

</td><td> </td></tr> <tr><td>

parse(path)

</td><td> </td></tr> <tr><td>

relative(from, to)

</td><td> </td></tr> <tr><td>

resolve(paths)

</td><td> </td></tr> </tbody></table>

Edit this section

<h2 id="experimentalfeatures-preventnavigate">preventNavigate</h2> <h2 id="qwikasset">QwikAsset</h2>
typescript
export interface QwikAsset
<table><thead><tr><th>

Property

</th><th>

Modifiers

</th><th>

Type

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

name

</td><td> </td><td>

string | undefined

</td><td>

Name of the asset

</td></tr> <tr><td>

size

</td><td> </td><td>

number

</td><td>

Size of the asset

</td></tr> </tbody></table>

Edit this section

<h2 id="qwikbuildmode">QwikBuildMode</h2>
typescript
export type QwikBuildMode = "production" | "development";

Edit this section

<h2 id="qwikbuildtarget">QwikBuildTarget</h2>
typescript
export type QwikBuildTarget = "client" | "ssr" | "lib" | "test";

Edit this section

<h2 id="qwikbundle">QwikBundle</h2>
typescript
export interface QwikBundle
<table><thead><tr><th>

Property

</th><th>

Modifiers

</th><th>

Type

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

dynamicImports?

</td><td> </td><td>

string[]

</td><td>

(Optional) Dynamic imports

</td></tr> <tr><td>

imports?

</td><td> </td><td>

string[]

</td><td>

(Optional) Direct imports

</td></tr> <tr><td>

interactivity?

</td><td> </td><td>

number

</td><td>

(Optional) Interactivity score of the bundle

</td></tr> <tr><td>

origins?

</td><td> </td><td>

string[]

</td><td>

(Optional) Source files of the bundle

</td></tr> <tr><td>

size

</td><td> </td><td>

number

</td><td>

Size of the bundle

</td></tr> <tr><td>

symbols?

</td><td> </td><td>

string[]

</td><td>

(Optional) Symbols in the bundle

</td></tr> <tr><td>

total

</td><td> </td><td>

number

</td><td>

Total size of this bundle's static import graph

</td></tr> </tbody></table>

Edit this section

<h2 id="qwikbundlegraph">QwikBundleGraph</h2>

Bundle graph.

Format: [ 'bundle-a.js', 3, 5 // Depends on 'bundle-b.js' and 'bundle-c.js' 'bundle-b.js', 5, // Depends on 'bundle-c.js' 'bundle-c.js', ]

typescript
export type QwikBundleGraph = Array<string | number>;

Edit this section

<h2 id="qwikmanifest">QwikManifest</h2>

The metadata of the build. One of its uses is storing where QRL symbols are located.

typescript
export interface QwikManifest
<table><thead><tr><th>

Property

</th><th>

Modifiers

</th><th>

Type

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

assets?

</td><td> </td><td>

{ [fileName: string]: QwikAsset; }

</td><td>

(Optional) All assets. The key is the fileName relative to the rootDir

</td></tr> <tr><td>

bundleGraph?

</td><td> </td><td>

QwikBundleGraph

</td><td>

(Optional) All bundles in a compact graph format with probabilities

</td></tr> <tr><td>

bundleGraphAsset?

</td><td> </td><td>

string

</td><td>

(Optional) The bundle graph fileName

</td></tr> <tr><td>

bundles

</td><td> </td><td>

{ [fileName: string]: QwikBundle; }

</td><td>

All code bundles, used to know the import graph. The key is the bundle fileName relative to "build/"

</td></tr> <tr><td>

core?

</td><td> </td><td>

string

</td><td>

(Optional) The Qwik core bundle fileName

</td></tr> <tr><td>

injections?

</td><td> </td><td>

GlobalInjections[]

</td><td>

(Optional) CSS etc to inject in the document head

</td></tr> <tr><td>

manifestHash

</td><td> </td><td>

string

</td><td>

Content hash of the manifest, if this changes, the code changed

</td></tr> <tr><td>

mapping

</td><td> </td><td>

{ [symbolName: string]: string; }

</td><td>

Where QRLs are located. The key is the symbol name, the value is the bundle fileName

</td></tr> <tr><td>

options?

</td><td> </td><td>

{ target?: string; buildMode?: string; entryStrategy?: { type: EntryStrategy['type']; }; }

</td><td>

(Optional) The options used to build the manifest

</td></tr> <tr><td>

platform?

</td><td> </td><td>

{ [name: string]: string; }

</td><td>

(Optional) The platform used to build the manifest

</td></tr> <tr><td>

preloader?

</td><td> </td><td>

string

</td><td>

(Optional) The preloader bundle fileName

</td></tr> <tr><td>

qwikLoader?

</td><td> </td><td>

string

</td><td>

(Optional) The Qwik loader bundle fileName

</td></tr> <tr><td>

symbols

</td><td> </td><td>

{ [symbolName: string]: QwikSymbol; }

</td><td>

QRL symbols

</td></tr> <tr><td>

version

</td><td> </td><td>

string

</td><td>

The version of the manifest

</td></tr> </tbody></table>

Edit this section

<h2 id="qwikrollup">qwikRollup</h2>
typescript
export declare function qwikRollup(
  qwikRollupOpts?: QwikRollupPluginOptions,
): any;
<table><thead><tr><th>

Parameter

</th><th>

Type

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

qwikRollupOpts

</td><td>

QwikRollupPluginOptions

</td><td>

(Optional)

</td></tr> </tbody></table>

Returns:

any

Edit this section

<h2 id="qwikrolluppluginoptions">QwikRollupPluginOptions</h2>
typescript
export interface QwikRollupPluginOptions
<table><thead><tr><th>

Property

</th><th>

Modifiers

</th><th>

Type

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

buildMode?

</td><td> </td><td>

QwikBuildMode

</td><td>

(Optional) Build production or development.

Default development

</td></tr> <tr><td>

csr?

</td><td> </td><td>

boolean

</td><td>

(Optional)

</td></tr> <tr><td>

debug?

</td><td> </td><td>

boolean

</td><td>

(Optional) Prints verbose Qwik plugin debug logs.

Default false

</td></tr> <tr><td>

entryStrategy?

</td><td> </td><td>

EntryStrategy

</td><td>

(Optional) The Qwik entry strategy to use while building for production. During development the type is always segment.

Default { type: "smart" })

</td></tr> <tr><td>

experimental?

</td><td> </td><td>

(keyof typeof ExperimentalFeatures)[]

</td><td>

(Optional) Experimental features. These can come and go in patch releases, and their API is not guaranteed to be stable between releases.

</td></tr> <tr><td>

lint?

</td><td> </td><td>

boolean

</td><td>

(Optional) Run eslint on the source files for the ssr build or dev server. This can slow down startup on large projects. Defaults to true

</td></tr> <tr><td>

manifestInput?

</td><td> </td><td>

QwikManifest

</td><td>

(Optional) The SSR build requires the manifest generated during the client build. The manifestInput option can be used to manually provide a manifest.

Default undefined

</td></tr> <tr><td>

manifestOutput?

</td><td> </td><td>

(manifest: QwikManifest) => Promise<void> | void

</td><td>

(Optional) The client build will create a manifest and this hook is called with the generated build data.

Default undefined

</td></tr> <tr><td>

optimizerOptions?

</td><td> </td><td>

OptimizerOptions

</td><td>

(Optional)

</td></tr> <tr><td>

rootDir?

</td><td> </td><td>

string

</td><td>

(Optional) The root of the application, which is commonly the same directory as package.json and rollup.config.js.

Default process.cwd()

</td></tr> <tr><td>

srcDir?

</td><td> </td><td>

string

</td><td>

(Optional) The source directory to find all the Qwik components. Since Qwik does not have a single input, the srcDir is used to recursively find Qwik files.

Default src

</td></tr> <tr><td>

srcInputs?

</td><td> </td><td>

TransformModuleInput[] | null

</td><td>

(Optional) Alternative to srcDir, where srcInputs is able to provide the files manually. This option is useful for an environment without a file system, such as a webworker.

Default: null

</td></tr> <tr><td>

target?

</td><td> </td><td>

QwikBuildTarget

</td><td>

(Optional) Target client or ssr.

Default client

</td></tr> <tr><td>

transformedModuleOutput?

</td><td> </td><td>

((transformedModules: TransformModule[]) => Promise<void> | void) | null

</td><td>

(Optional) Hook that's called after the build and provides all of the transformed modules that were used before bundling.

</td></tr> </tbody></table>

Edit this section

<h2 id="qwiksymbol">QwikSymbol</h2>
typescript
export interface QwikSymbol
<table><thead><tr><th>

Property

</th><th>

Modifiers

</th><th>

Type

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

canonicalFilename

</td><td> </td><td>

string

</td><td> </td></tr> <tr><td>

captures

</td><td> </td><td>

boolean

</td><td> </td></tr> <tr><td>

ctxKind

</td><td> </td><td>

'function' | 'eventHandler'

</td><td> </td></tr> <tr><td>

ctxName

</td><td> </td><td>

string

</td><td> </td></tr> <tr><td>

displayName

</td><td> </td><td>

string

</td><td> </td></tr> <tr><td>

hash

</td><td> </td><td>

string

</td><td> </td></tr> <tr><td>

loc

</td><td> </td><td>

[number, number]

</td><td> </td></tr> <tr><td>

origin

</td><td> </td><td>

string

</td><td> </td></tr> <tr><td>

parent

</td><td> </td><td>

string | null

</td><td> </td></tr> </tbody></table>

Edit this section

<h2 id="qwikvite">qwikVite</h2>

The types for Vite/Rollup don't allow us to be too specific about the return type. The correct return type is [QwikVitePlugin, VitePlugin<never>], and if you search the plugin by name you'll get the QwikVitePlugin.

typescript
export declare function qwikVite(qwikViteOpts?: QwikVitePluginOptions): any;
<table><thead><tr><th>

Parameter

</th><th>

Type

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

qwikViteOpts

</td><td>

QwikVitePluginOptions

</td><td>

(Optional)

</td></tr> </tbody></table>

Returns:

any

Edit this section

<h2 id="qwikvitedevresponse">QwikViteDevResponse</h2>
typescript
export interface QwikViteDevResponse
<table><thead><tr><th>

Property

</th><th>

Modifiers

</th><th>

Type

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

_qwikEnvData?

</td><td> </td><td>

Record<string, any>

</td><td>

(Optional)

</td></tr> <tr><td>

_qwikRenderResolve?

</td><td> </td><td>

() => void

</td><td>

(Optional)

</td></tr> </tbody></table>

Edit this section

<h2 id="qwikviteplugin">QwikVitePlugin</h2>

This is the type of the "pre" Qwik Vite plugin. qwikVite actually returns a tuple of two plugins, but after Vite flattens them, you can find the plugin by name.

typescript
export type QwikVitePlugin = P<QwikVitePluginApi> & {
  name: "vite-plugin-qwik";
};

References: QwikVitePluginApi

Edit this section

<h2 id="qwikvitepluginapi">QwikVitePluginApi</h2>
typescript
export interface QwikVitePluginApi
<table><thead><tr><th>

Property

</th><th>

Modifiers

</th><th>

Type

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

getAssetsDir

</td><td> </td><td>

() => string | undefined

</td><td> </td></tr> <tr><td>

getClientOutDir

</td><td> </td><td>

() => string | null

</td><td> </td></tr> <tr><td>

getClientPublicOutDir

</td><td> </td><td>

() => string | null

</td><td> </td></tr> <tr><td>

getManifest

</td><td> </td><td>

() => QwikManifest | null

</td><td> </td></tr> <tr><td>

getOptimizer

</td><td> </td><td>

() => Optimizer | null

</td><td> </td></tr> <tr><td>

getOptions

</td><td> </td><td>

() => NormalizedQwikPluginOptions

</td><td> </td></tr> <tr><td>

getRootDir

</td><td> </td><td>

() => string | null

</td><td> </td></tr> <tr><td>

registerBundleGraphAdder

</td><td> </td><td>

(adder: BundleGraphAdder) => void

</td><td> </td></tr> </tbody></table>

Edit this section

<h2 id="qwikvitepluginoptions">QwikVitePluginOptions</h2>
typescript
export type QwikVitePluginOptions =
  | QwikVitePluginCSROptions
  | QwikVitePluginSSROptions;

Edit this section

<h2 id="path-relative">relative</h2>
typescript
relative(from: string, to: string): string;
<table><thead><tr><th>

Parameter

</th><th>

Type

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

from

</td><td>

string

</td><td> </td></tr> <tr><td>

to

</td><td>

string

</td><td> </td></tr> </tbody></table>

Returns:

string

<h2 id="path-resolve">resolve</h2>
typescript
resolve(...paths: string[]): string;
<table><thead><tr><th>

Parameter

</th><th>

Type

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

paths

</td><td>

string[]

</td><td> </td></tr> </tbody></table>

Returns:

string

<h2 id="resolvedmanifest">ResolvedManifest</h2>
typescript
export interface ResolvedManifest
<table><thead><tr><th>

Property

</th><th>

Modifiers

</th><th>

Type

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

injections

</td><td> </td><td>

GlobalInjections[]

</td><td> </td></tr> <tr><td>

manifest

</td><td> </td><td>

ServerQwikManifest

</td><td> </td></tr> <tr><td>

mapper

</td><td> </td><td>

SymbolMapper

</td><td> </td></tr> </tbody></table>

Edit this section

<h2 id="segmentanalysis">SegmentAnalysis</h2>
typescript
export interface SegmentAnalysis
<table><thead><tr><th>

Property

</th><th>

Modifiers

</th><th>

Type

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

canonicalFilename

</td><td> </td><td>

string

</td><td> </td></tr> <tr><td>

captures

</td><td> </td><td>

boolean

</td><td> </td></tr> <tr><td>

ctxKind

</td><td> </td><td>

'eventHandler' | 'function'

</td><td> </td></tr> <tr><td>

ctxName

</td><td> </td><td>

string

</td><td> </td></tr> <tr><td>

displayName

</td><td> </td><td>

string

</td><td> </td></tr> <tr><td>

entry

</td><td> </td><td>

string | null

</td><td> </td></tr> <tr><td>

extension

</td><td> </td><td>

string

</td><td> </td></tr> <tr><td>

hash

</td><td> </td><td>

string

</td><td> </td></tr> <tr><td>

loc

</td><td> </td><td>

[number, number]

</td><td> </td></tr> <tr><td>

name

</td><td> </td><td>

string

</td><td> </td></tr> <tr><td>

origin

</td><td> </td><td>

string

</td><td> </td></tr> <tr><td>

parent

</td><td> </td><td>

string | null

</td><td> </td></tr> </tbody></table>

Edit this section

<h2 id="segmententrystrategy">SegmentEntryStrategy</h2>
typescript
export interface SegmentEntryStrategy
<table><thead><tr><th>

Property

</th><th>

Modifiers

</th><th>

Type

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

manual?

</td><td> </td><td>

Record<string, string>

</td><td>

(Optional)

</td></tr> <tr><td>

type

</td><td> </td><td>

'segment'

</td><td> </td></tr> </tbody></table>

Edit this section

<h2 id="serverqwikmanifest">ServerQwikManifest</h2>

The manifest values that are needed for SSR.

typescript
export type ServerQwikManifest = Pick<
  QwikManifest,
  | "manifestHash"
  | "injections"
  | "bundleGraph"
  | "bundleGraphAsset"
  | "mapping"
  | "preloader"
  | "core"
  | "qwikLoader"
>;

References: QwikManifest

Edit this section

<h2 id="singleentrystrategy">SingleEntryStrategy</h2>
typescript
export interface SingleEntryStrategy
<table><thead><tr><th>

Property

</th><th>

Modifiers

</th><th>

Type

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

manual?

</td><td> </td><td>

Record<string, string>

</td><td>

(Optional)

</td></tr> <tr><td>

type

</td><td> </td><td>

'single'

</td><td> </td></tr> </tbody></table>

Edit this section

<h2 id="smartentrystrategy">SmartEntryStrategy</h2>
typescript
export interface SmartEntryStrategy
<table><thead><tr><th>

Property

</th><th>

Modifiers

</th><th>

Type

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

manual?

</td><td> </td><td>

Record<string, string>

</td><td>

(Optional)

</td></tr> <tr><td>

type

</td><td> </td><td>

'smart'

</td><td> </td></tr> </tbody></table>

Edit this section

<h2 id="sourcelocation">SourceLocation</h2>
typescript
export interface SourceLocation
<table><thead><tr><th>

Property

</th><th>

Modifiers

</th><th>

Type

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

endCol

</td><td> </td><td>

number

</td><td> </td></tr> <tr><td>

endLine

</td><td> </td><td>

number

</td><td> </td></tr> <tr><td>

hi

</td><td> </td><td>

number

</td><td> </td></tr> <tr><td>

lo

</td><td> </td><td>

number

</td><td> </td></tr> <tr><td>

startCol

</td><td> </td><td>

number

</td><td> </td></tr> <tr><td>

startLine

</td><td> </td><td>

number

</td><td> </td></tr> </tbody></table>

Edit this section

<h2 id="sourcemapsoption">SourceMapsOption</h2>
typescript
export type SourceMapsOption = "external" | "inline" | undefined | null;

Edit this section

<h2 id="symbolmapper-variable">symbolMapper</h2>

This API is provided as an alpha preview for developers and may change based on feedback that we receive. Do not use this API in a production environment.

For a given symbol (QRL such as onKeydown$) the server needs to know which bundle the symbol is in.

Normally this is provided by Qwik's q-manifest . But q-manifest only exists after a full client build.

This would be a problem in dev mode. So in dev mode the symbol is mapped to the expected URL using the symbolMapper function below. For Vite the given path is fixed for a given symbol.

typescript
symbolMapper: ReturnType<typeof createSymbolMapper>;

Edit this section

<h2 id="symbolmapper-type-alias">SymbolMapper</h2>

This API is provided as an alpha preview for developers and may change based on feedback that we receive. Do not use this API in a production environment.

For a given symbol (QRL such as onKeydown$) the server needs to know which bundle the symbol is in.

Normally this is provided by Qwik's q-manifest . But q-manifest only exists after a full client build.

This would be a problem in dev mode. So in dev mode the symbol is mapped to the expected URL using the symbolMapper function below. For Vite the given path is fixed for a given symbol.

typescript
symbolMapper: ReturnType<typeof createSymbolMapper>;

Edit this section

<h2 id="symbolmapperfn">SymbolMapperFn</h2>
typescript
export type SymbolMapperFn = (
  symbolName: string,
  mapper: SymbolMapper | undefined,
  parent?: string,
) => readonly [symbol: string, chunk: string] | undefined;

References: SymbolMapper

Edit this section

<h2 id="systemenvironment">SystemEnvironment</h2>
typescript
export type SystemEnvironment =
  | "node"
  | "deno"
  | "bun"
  | "webworker"
  | "browsermain"
  | "unknown";

Edit this section

<h2 id="optimizer-transformfs">transformFs</h2>

Transforms the directory from the file system.

typescript
transformFs(opts: TransformFsOptions): Promise<TransformOutput>;
<table><thead><tr><th>

Parameter

</th><th>

Type

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

opts

</td><td>

TransformFsOptions

</td><td> </td></tr> </tbody></table>

Returns:

Promise<TransformOutput>

<h2 id="transformfsoptions">TransformFsOptions</h2>
typescript
export interface TransformFsOptions extends TransformOptions

Extends: TransformOptions

<table><thead><tr><th>

Property

</th><th>

Modifiers

</th><th>

Type

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

vendorRoots

</td><td> </td><td>

string[]

</td><td> </td></tr> </tbody></table>

Edit this section

<h2 id="optimizer-transformfssync">transformFsSync</h2>

Transforms the directory from the file system.

typescript
transformFsSync(opts: TransformFsOptions): TransformOutput;
<table><thead><tr><th>

Parameter

</th><th>

Type

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

opts

</td><td>

TransformFsOptions

</td><td> </td></tr> </tbody></table>

Returns:

TransformOutput

<h2 id="transformmodule">TransformModule</h2>
typescript
export interface TransformModule
<table><thead><tr><th>

Property

</th><th>

Modifiers

</th><th>

Type

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

code

</td><td> </td><td>

string

</td><td> </td></tr> <tr><td>

isEntry

</td><td> </td><td>

boolean

</td><td> </td></tr> <tr><td>

map

</td><td> </td><td>

string | null

</td><td> </td></tr> <tr><td>

origPath

</td><td> </td><td>

string | null

</td><td> </td></tr> <tr><td>

path

</td><td> </td><td>

string

</td><td> </td></tr> <tr><td>

segment

</td><td> </td><td>

SegmentAnalysis | null

</td><td> </td></tr> </tbody></table>

Edit this section

<h2 id="transformmoduleinput">TransformModuleInput</h2>
typescript
export interface TransformModuleInput
<table><thead><tr><th>

Property

</th><th>

Modifiers

</th><th>

Type

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

code

</td><td> </td><td>

string

</td><td> </td></tr> <tr><td>

devPath?

</td><td> </td><td>

string

</td><td>

(Optional)

</td></tr> <tr><td>

path

</td><td> </td><td>

string

</td><td> </td></tr> </tbody></table>

Edit this section

<h2 id="optimizer-transformmodules">transformModules</h2>

Transforms the input code string, does not access the file system.

typescript
transformModules(opts: TransformModulesOptions): Promise<TransformOutput>;
<table><thead><tr><th>

Parameter

</th><th>

Type

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

opts

</td><td>

TransformModulesOptions

</td><td> </td></tr> </tbody></table>

Returns:

Promise<TransformOutput>

<h2 id="transformmodulesoptions">TransformModulesOptions</h2>
typescript
export interface TransformModulesOptions extends TransformOptions

Extends: TransformOptions

<table><thead><tr><th>

Property

</th><th>

Modifiers

</th><th>

Type

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

input

</td><td> </td><td>

TransformModuleInput[]

</td><td> </td></tr> </tbody></table>

Edit this section

<h2 id="optimizer-transformmodulessync">transformModulesSync</h2>

Transforms the input code string, does not access the file system.

typescript
transformModulesSync(opts: TransformModulesOptions): TransformOutput;
<table><thead><tr><th>

Parameter

</th><th>

Type

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

opts

</td><td>

TransformModulesOptions

</td><td> </td></tr> </tbody></table>

Returns:

TransformOutput

<h2 id="transformoptions">TransformOptions</h2>
typescript
export interface TransformOptions
<table><thead><tr><th>

Property

</th><th>

Modifiers

</th><th>

Type

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

entryStrategy?

</td><td> </td><td>

EntryStrategy

</td><td>

(Optional)

</td></tr> <tr><td>

explicitExtensions?

</td><td> </td><td>

boolean

</td><td>

(Optional)

</td></tr> <tr><td>

isServer?

</td><td> </td><td>

boolean

</td><td>

(Optional)

</td></tr> <tr><td>

minify?

</td><td> </td><td>

MinifyMode

</td><td>

(Optional)

</td></tr> <tr><td>

mode?

</td><td> </td><td>

EmitMode

</td><td>

(Optional)

</td></tr> <tr><td>

preserveFilenames?

</td><td> </td><td>

boolean

</td><td>

(Optional)

</td></tr> <tr><td>

regCtxName?

</td><td> </td><td>

string[]

</td><td>

(Optional)

</td></tr> <tr><td>

rootDir?

</td><td> </td><td>

string

</td><td>

(Optional)

</td></tr> <tr><td>

scope?

</td><td> </td><td>

string

</td><td>

(Optional)

</td></tr> <tr><td>

sourceMaps?

</td><td> </td><td>

boolean

</td><td>

(Optional)

</td></tr> <tr><td>

srcDir

</td><td> </td><td>

string

</td><td> </td></tr> <tr><td>

stripCtxName?

</td><td> </td><td>

string[]

</td><td>

(Optional)

</td></tr> <tr><td>

stripEventHandlers?

</td><td> </td><td>

boolean

</td><td>

(Optional)

</td></tr> <tr><td>

stripExports?

</td><td> </td><td>

string[]

</td><td>

(Optional)

</td></tr> <tr><td>

transpileJsx?

</td><td> </td><td>

boolean

</td><td>

(Optional)

</td></tr> <tr><td>

transpileTs?

</td><td> </td><td>

boolean

</td><td>

(Optional)

</td></tr> </tbody></table>

Edit this section

<h2 id="transformoutput">TransformOutput</h2>
typescript
export interface TransformOutput
<table><thead><tr><th>

Property

</th><th>

Modifiers

</th><th>

Type

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

diagnostics

</td><td> </td><td>

Diagnostic[]

</td><td> </td></tr> <tr><td>

isJsx

</td><td> </td><td>

boolean

</td><td> </td></tr> <tr><td>

isTypeScript

</td><td> </td><td>

boolean

</td><td> </td></tr> <tr><td>

modules

</td><td> </td><td>

TransformModule[]

</td><td> </td></tr> </tbody></table>

Edit this section

<h2 id="transpileoption">TranspileOption</h2>
typescript
export type TranspileOption = boolean | undefined | null;

Edit this section

<h2 id="experimentalfeatures-valibot">valibot</h2> <h2 id="versions">versions</h2>
typescript
versions: {
  qwik: string;
}

Edit this section