Stencil build fails in CI with an invalid component tag diagnostic — how should logs be triaged?

Answer first: do not grep message text

For Stencil 4.x a compiler diagnostic and a hosting/output error are distinguishable in CI by phase and log shape, not by a stable English sentence. Grepping for a specific message will break on major upgrades because wording changes. Use exit code + structural markers.

Confirmed facts for Stencil 4.x

• Stencil build exits non-zero on compiler errors. The CLI prints diagnostics with a severity prefix and a source location, e.g. [error] src/components/foo/foo.tsx:12:3. The file path, line and column are emitted by the compiler.
• Compiler diagnostics appear during the transpile / build phase, before output targets run. They reference files under your src/ tree and the @Component decorator.
• stencil build --debug and --verbose increase internal logging. Output remains human-readable console text, not structured JSON. There is no documented stable machine-readable log format for automation in 4.x.

Likely explanation for your change

The diagnostic you saw for an invalid component tag — tag must be lowercase, contain a hyphen, and not be a reserved HTML tag — is emitted by the compiler. After a major version upgrade the wording and sometimes the code label change, so a string match stops working even though the failure is real.

Dependable triage steps for this case

1. Capture the full build log and exit code.

   stencil build --verbose 2>&1; echo "EXIT=$?"

   Non-zero exit with an early [error] block referencing src/ is a compiler diagnostic.
2. Identify compiler vs bundler/hosting by marker position.
3. Compiler diagnostic markers:

• First [error] or [warn] line contains a project source path and :line:col.
• Context mentions @Component, tag, transpile, or rollup for bundling.

• Hosting/output error markers:
• Errors appear after the build phase, e.g. "Output target dist" or missing www folder.
• Messages reference the output directory, e.g. dist/www, dist/, or a deploy step, with no source file path.

1. Avoid hard-coded text. Instead assert:

• Exit code != 0
• Log contains [error] AND a src/ file path with :\d+:\d+
• For component tag validation specifically, the file path points to a component file and the surrounding lines mention tag: in the @Component decorator.

This pattern is version-stable because file path + line/col formatting has been consistent in 4.x, while the English sentence is not.

Safe verification

• Run locally with the same lockfile: npm ci && stencil build --verbose and diff the first error block with CI.
• Check the file indicated in the log for tag value. It must be lowercase, hyphenated, and not a reserved tag.
• Verify output target config matches CI. A missing www folder is usually a wrong outputTargets.dist path, not a compiler error.

One missing detail that changes the recommendation: the exact Stencil version and your outputTargets config. If you are using a custom output target or a monorepo with hoisted @stencil/core, the phase ordering can shift and the file path pattern needs adjustment.