# 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.
compile(source, filename, config)— config is the third argument and is requiredparse(source, config)— config is the second argument and defaults to{}
# Step 2: Ensure the Config Is an Object
Verify that the config argument is a plain object ({}). Common fixes:
- Missing argument: Add an empty object
{}or a proper config object - Wrong argument order: Check that source, filename, and config are in the correct order
- Uninvoked function: Call the function (e.g.,
getConfig()instead ofgetConfig) - Wrong variable: Make sure that the variable holds an object, not a primitive
For specific code examples, see the Error Resolution Examples in the preceding Examples section.
# Step 3: Verify the Fix
- Re-run the template compilation
- Make sure that LWC1028 no longer appears
- Confirm that the template compiles successfully