Skip to content

Styles from standalone page templates leaking into other templates #16179

@jurajkapsz

Description

@jurajkapsz

Astro Info

Astro                    v6.1.2
Vite                     v7.3.1
Node                     v24.6.0
System                   Linux (x64)
Package Manager          pnpm
Output                   static
Adapter                  @astrojs/node (v10.0.4)
Integrations             @astrojs/mdx (v5.0.3)
                         build/info
                         build/images
                         build/cleanup
                         @astrojs/sitemap (v3.7.2)
                         gab-astro-compress (v0.1.2)

If this issue only occurs in one browser, which browser is a problem?

No response

Describe the Bug

After upgrading an Astro project from v5 to v6, styles defined in standalone src/pages astro templates, which have nothing in common between each other, appear on all pages after running build (not during dev). This wasn't the case in v5.

I have following /src/pages:

  • index.astro -- empty, basically not used/visited (I use nginx redirects that redirect from index to specific locales); I added a style tag just for testing purpose and the styles are part of every generated page.
  • [...page].astro -- a page that displays content collection entries.
  • settings-[id].astro -- a standalone subpage with some website settings. This page has different visual template/styles, and its styles propagate onto other pages as well, which they should not (and did not under Astro v5).

For example, .astro template of the mentioned index.astro (but which is not being visited in my understanding):

<style>
  body {
    border: 2px solid red !important;
  }
</style>

This style has impact on all generated pages.

So far, I did not managed to reproduce it locally/on stackblitz on brand new Astro v6 install. But not sure what is different on my v5 site and how does v6 expects pages or styles to be implemented. I would need help with this to narrow it down, but I am not sure if I can share the whole website code where it happens though.


Also, I noticed that when in dev mode, some component's styles do not load, leaving the components unstyled and they get styled only with build. But this is probably another issue.

What's the expected result?

Styles should not leak across templates.

Link to Minimal Reproducible Example

Participation

  • I am willing to submit a pull request for this issue.

Metadata

Metadata

Assignees

No one assigned

    Labels

    - P4: importantViolate documented behavior or significantly impacts performance (priority)pkg: astroRelated to the core `astro` package (scope)

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions