Comments (3)
Thank you very much for taking the time to solve this problem. Have a nice weekend. 😀
from vite-plugin-lib-inject-css.
Seems a little strange…but I'm too busy to work on this now. I’ll appreciate it if there’s anyone who can open a pull request🙏.
from vite-plugin-lib-inject-css.
Reason
I dive deep into the source code of Vite and found that the common css file you referenced will be transform into a pureCssChunk
like:
// common.Bkwfiy39.js
import "../assets/common.css";
And then you'll get import "./common.Bkwfiy39.js";
in the origin chunk
import { test as i } from "../common.js";
import "./common.Bkwfiy39.js"; // It's a common chunk.
But after the internal cssPostPlugin
hook generateBundle
was executed, all of the pureCssChunks
imports were replaced with empty css comment.
import { test as i } from "../common.js";
/* empty css */
But! Vite will pass the removed chunk's viteMetaData
to the dependent chunk, which is done in generateChunk
, here's detail:
// remove pure css chunk from other chunk's imports,
// and also register the emitted CSS files under the importer
// chunks instead.
chunk.imports = chunk.imports.filter((file) => {
if (pureCssChunkNames.includes(file)) {
const { importedCss, importedAssets } = bundle[file].viteMetadata;
importedCss.forEach((file) => chunk.viteMetadata.importedCss.add(file));
importedAssets.forEach((file) => chunk.viteMetadata.importedAssets.add(file));
return false;
}
return true;
});
Conclusion
Our plugin finish code injection at renderChunk
hook which is executed before generateChunk
, that's what happened to you. Maybe I should consider how to complete it in generateChunk
hook. 🤔🤔
from vite-plugin-lib-inject-css.
Related Issues (19)
- Can't use optional chaining HOT 1
- when i use input to set entries and change css name in manualChunks, inject failed HOT 8
- vite-plugin-lib-inject-css not working on SSR HOT 4
- Consider @import url() HOT 3
- "npm run build-storybook" returns error "TypeError: Cannot convert undefined or null to object" HOT 7
- Injecting problematic js imports and making circular dependency HOT 1
- [Error] Cannot build Storybook with vite-plugin-lib-inject-css: TypeError "Cannot convert undefined or null to object" HOT 3
- circular dependency scanner has a circular dependency HOT 6
- issue while building HOT 4
- CSS file imports are appearing above banner section HOT 5
- Is there a way to make this work with lightningcss? HOT 1
- Error: Cannot find module '@ast-grep/napi-darwin-x64' in version 2.1.0 HOT 20
- Css still all loaded HOT 1
- Any way to skip the CSS of an external dependency? HOT 3
- Replace `renderChunk` with `generateBundle` hook might be better? (vite:lib-inject-css) HOT 10
- Check for deprecated rollupOptions.preserveModules HOT 7
- Make `ds` command fail (exit code 1) if a circular dependency is detected HOT 1
- Incorrect css insertion path on Windows HOT 3
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from vite-plugin-lib-inject-css.