Skip to content
This repository has been archived by the owner on Mar 18, 2021. It is now read-only.

Duplicate global/preflight injections #10

Open
danielroe opened this issue Feb 21, 2021 · 2 comments
Open

Duplicate global/preflight injections #10

danielroe opened this issue Feb 21, 2021 · 2 comments

Comments

@danielroe
Copy link

Using Nuxt, in my final CSS I have an additional copy of all global styles for every component added to the <head>. For example, the following CSS could easily be repeated 10-20x:

body {
    margin: 0;
    font-family: inherit;
    line-height: inherit;
}
* {
    --tw-ring-inset: var(--tw-empty, );
    --tw-ring-offset-width: 0px;
    --tw-ring-offset-color: #fff;
    --tw-ring-color: rgba(59,130,246,0.5);
    --tw-ring-offset-shadow: 0 0 transparent;
    --tw-ring-shadow: 0 0 transparent;
    --tw-shadow: 0 0 transparent;
}
// etc.
@reslear
Copy link
Collaborator

reslear commented Feb 21, 2021

@danielroe same
reproduction in example Nuxt composition api & typescript example
cc @voorjaar

@harlan-zw
Copy link
Member

harlan-zw commented Feb 22, 2021

I'm not sure how easy it is to solve this with the current setup. This package is a webpack loader and only has the ability to transform loaded files.

I'm working on a webpack-plugin version that provides a virtual module css dependency that will handle the duplication and caching correctly, similar to the vite-plugin.

I'd recommend only using this package in development for now, unless you have a solution to resolve this duplication.

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants