Angular-cli: index.html styles bundle link tag not closed causes problem with strict HTML validation

[cacogr]

OS?

Windows 10

Versions.

angular-cli: 1.0.0-beta.20-4
node: 6.9.1
npm: 3.10.8

I believe https://github.com/angular/angular-cli/pull/2646 introduced a change in which styles are bundled in their own css file in a link tag in index.html. The problem is this link tag is missing the closing / thus not passing strict validation.

Line 13, Column 88: end tag for "link" omitted, but OMITTAG NO was specified
…f="styles.6aa49abe71cac0b676ea04c83b8009cd.bundle.css" rel="stylesheet"></head>
You may have neglected to close an element, or perhaps you meant to "self-close" an element, that is, ending it with "/>" instead of ">".

The template engine we have in the server, used to inject environment variables, etc. in the index.html before serving it, requires it to be a well-formed XHTML so every element must be closed.

Can you do anything about it?

[grizzm0]

Angular-cli uses HTML5 and not XHTML. Elements without closing / is perfectly valid in HTML5.

Configure your parser to use HTML5 instad of XHTML.

[filipesilva]

As @grizzm0 said HTML5 is perfectly fine with unclosed tags. I'm happy to review a PR that adds self closing tags if it helps people though.

Probably somewhere in the HtmlWebpackPlugin config I'd say.

[CarreraPHP]

Adding xhtml:true option to htmlwebpackplugin should enable closing tag. It should be added in webpack-build-common.ts file

[CarreraPHP]

@filipesilva @cacogr, PR #3743 created to add this feature.

[ishitatsuyuki]

Just to note you, this will be disabled again if my PR #5753 is merged. XHTML means one redundant character in minifying.

[TunaYagci]

Hey @CarreraPHP @filipesilva how do we enable this option? I couldn't compile CLI's index.html from Spring (thymeleaf) without doing this.

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{_This action has been performed automatically by a bot._}