# LWC1028

Represents a template compiler error when the configuration parameter is not an object.

Severity: Error

# Message

Compiler options must be an object

Example diagnostic message:

LWC1028: Compiler options must be an object

# Problem

LWC1028 occurs when the template compiler receives a non-object value for its configuration parameter. The template compiler validates that the config argument is an object before proceeding with compilation. If the config is undefined, a string, a number, a boolean, or a function, this error occurs.

# Examples

LWC1028 occurs when the template compiler's configuration parameter isn’t an object. This scenario typically happens when calling compile() without the required config argument, or when passing an incorrect type.

# 1. Missing Options Parameter

The most common cause is calling compile() without providing the required third argument (the config object). Unlike parse(), which defaults to an empty object, compile() requires the config parameter to be explicitly provided.

# Examples with Errors

Here are several examples that return error code LWC1028.

Calling compile() without config:

import { compile } from '@lwc/template-compiler';

const result = compile('<template>Hello</template>', 'myComponent.html');

Error Message: LWC1028: Compiler options must be an object

Explicitly passing undefined as config:

import { compile } from '@lwc/template-compiler';

const config = undefined;
const result = compile('<template>Hello</template>', 'myComponent.html', config);

Error Message: LWC1028: Compiler options must be an object

# Error Resolution Examples

Here are several ways to fix error code LWC1028.

Provide an empty object or a config object as the third argument:

import { compile } from '@lwc/template-compiler';

const result = compile('<template>Hello</template>', 'myComponent.html', {});

Provide a config object with options:

import { compile } from '@lwc/template-compiler';

const result = compile('<template>Hello</template>', 'myComponent.html', {
    preserveHtmlComments: false,
    enableStaticContentOptimization: true,
});

# 2. Primitive Values as Options

Passing a string, number, or boolean value instead of a config object triggers this error. This scenario can happen when arguments are passed in the wrong order, or when a variable intended to hold the config has the wrong type.

# Examples with Errors

Here are several examples that return error code LWC1028.

String passed as config (arguments in wrong order):

import { compile } from '@lwc/template-compiler';

// Accidentally swapped filename and config
const result = compile('<template>Hello</template>', {}, 'myComponent.html');

Error Message: LWC1028: Compiler options must be an object

Number passed as config:

import { compile } from '@lwc/template-compiler';

const result = compile('<template>Hello</template>', 'myComponent.html', 42);

Error Message: LWC1028: Compiler options must be an object

# Error Resolution Examples

Here's how you can fix error code LWC1034.

Use the correct argument order — compile(source, filename, config):

import { compile } from '@lwc/template-compiler';

const result = compile('<template>Hello</template>', 'myComponent.html', {
    preserveHtmlComments: false,
});

# 3. Function References as Options

Passing a function instead of a config object triggers this error. This scenario can happen when accidentally passing a callback or factory function without invoking it.

# Examples with Errors

Here's an example that returns error code LWC1034.

Function passed instead of config object:

import { compile } from '@lwc/template-compiler';

function getConfig() {
    return { preserveHtmlComments: true };
}

// Forgot to call getConfig()
const result = compile('<template>Hello</template>', 'myComponent.html', getConfig);

Error Message: LWC1028: Compiler options must be an object

# Error Resolution Examples

Here's how you can fix error code LWC1028.

Invoke the function to get the config object:

import { compile } from '@lwc/template-compiler';

function getConfig() {
    return { preserveHtmlComments: true };
}

const result = compile('<template>Hello</template>', 'myComponent.html', getConfig());

# 4. Non-Object Config via parse() API

The parse() function defaults to an empty object {} when no config is provided, so calling parse() without a config works fine. However, explicitly passing a non-object value as the config still triggers this error.

# Examples with Errors

Here's an example that returns error code LWC1028.

Passing a string config to parse():

import { parse } from '@lwc/template-compiler';

const result = parse('<template>Hello</template>', 'not-an-object');

Error Message: LWC1028: Compiler options must be an object

# Error Resolution Examples

Here's how you can fix error code LWC1028.

Omit the config parameter or pass an object:

import { parse } from '@lwc/template-compiler';

// Option 1: Omit config entirely (defaults to {})
const result = parse('<template>Hello</template>');

// Option 2: Pass a config object
const result2 = parse('<template>Hello</template>', {
    preserveHtmlComments: true,
});

# Suggested Fix Steps

Consider these suggestions to fix LWC1028 errors.

# Step 1: Identify the API Call

Determine which template compiler function is being called (compile() or parse()) and check the arguments being passed.

# Step 2: Ensure the Config Is an Object

Verify that the config argument is a plain object ({}). Common fixes:

For specific code examples, see the Error Resolution Examples in the preceding Examples section.

# Step 3: Verify the Fix

  1. Re-run the template compilation
  2. Make sure that LWC1028 no longer appears
  3. Confirm that the template compiles successfully