Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

CSS is leaked to JS when @vitejs/plugin-legacy is used #3861

Closed
jiyingzhi opened this issue Jun 18, 2021 · 3 comments
Closed

CSS is leaked to JS when @vitejs/plugin-legacy is used #3861

jiyingzhi opened this issue Jun 18, 2021 · 3 comments

Comments

@jiyingzhi
Copy link

Describe the bug

Even if the CSS is split into separate files, it will still be injected into JS, using @vitejs/plugin-legacy.

Reproduction

Run the following command:

git clone git@github.com:jiyingzhi/vite-bug.git
npm i
npm run build

output:

dist/assets/vendor-legacy.60abe03a.js      51.65kb / brotli: 16.90kb
dist/assets/polyfills-legacy.df455098.js   73.89kb / brotli: 26.08kb
dist/assets/index-legacy.19f6a2d2.js       178.76kb / brotli: 42.35kb
dist/assets/logo.03d6d6da.png    6.69kb
dist/index.html                  1.05kb
dist/assets/index.0af28c7f.js    1.47kb / brotli: 0.71kb
dist/assets/vendor.e2d3fd7e.js   42.92kb / brotli: 15.53kb
dist/assets/index.b97d446c.css   177.38kb / brotli: 41.70kb

The size of dist/assets/index-legacy.19f6a2d2.js minus the size of dist/assets/index.0af28c7f.js is exactly the size of dist/assets/index.b97d446c.css.

System Info

Output of npx envinfo --system --npmPackages vite,@vitejs/plugin-vue --binaries --browsers:

System:
    OS: macOS 11.2.3
    CPU: (8) arm64 Apple M1
    Memory: 112.16 MB / 16.00 GB
    Shell: 5.8 - /bin/zsh
Binaries:
    Node: 15.14.0 - ~/.nvm/versions/node/v15.14.0/bin/node
    npm: 6.14.13 - ~/.nvm/versions/node/v15.14.0/bin/npm
    Watchman: 4.9.0 - /opt/homebrew/bin/watchman
Browsers:
    Chrome: 91.0.4472.101
    Edge: 90.0.818.41
    Safari: 14.0.3
npmPackages:
    @vitejs/plugin-vue: ^1.2.3 => 1.2.3 
    vite: ^2.3.7 => 2.3.7

Used package manager: npm


Before submitting the issue, please make sure you do the following

  • [ x] Read the Contributing Guidelines.
  • [ x] Read the docs.
  • [ x] Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
  • [ x] Provide a description in this issue that describes the bug.
  • [ x] Make sure this is a Vite issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to https://github.com/vuejs/vue-next instead.
  • [ x] Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
@mila76
Copy link

mila76 commented Oct 16, 2021

same issue here

@bluwy bluwy added bug and removed pending triage labels Mar 12, 2022
@bluwy
Copy link
Member

bluwy commented Mar 12, 2022

Can confirm this is still happening with the latest version of Vite and plugin-legacy. I can't tell why or where this is happening though.

@bluwy
Copy link
Member

bluwy commented Mar 12, 2022

@sapphi-red helped tracked this one down (thanks!), and it looks like a duplicate of #2062. There's a comment mentioning that it's intentional, but can be improved: #2062 (comment)

@bluwy bluwy closed this as completed Mar 12, 2022
@github-actions github-actions bot locked and limited conversation to collaborators Mar 27, 2022
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

No branches or pull requests

4 participants