vite-plugin-css-injected-by-js - npm Package Compare versions

Comparing version 3.2.0 to 3.2.1

dist/cjs/utils.js

@@ -172,2 +172,4 @@ "use strict";
 exports.relativeCssInjection = relativeCssInjection;
+const globalCSSCodeEntryCache = new Map();
+let previousFacadeModuleId = '';
 function globalCssInjection(bundle, cssAssets, buildCssCode, jsAssetsFilterFunction, topExecutionPriorityFlag) {
@@ -183,5 +185,29 @@ var _a;
         const allCssCode = concatCssAndDeleteFromBundle(bundle, cssAssets);
-        const cssInjectionCode = allCssCode.length > 0 ? (_a = (yield buildCssCode(allCssCode))) === null || _a === void 0 ? void 0 : _a.code : '';
+        let cssInjectionCode = '';
+        if (allCssCode.length > 0) {
+            const cssCode = (_a = (yield buildCssCode(allCssCode))) === null || _a === void 0 ? void 0 : _a.code;
+            if (typeof cssCode == 'string') {
+                cssInjectionCode = cssCode;
+            }
+        }
         for (const jsTargetKey of jsTargetBundleKeys) {
             const jsAsset = bundle[jsTargetKey];
+            /**
+             * Since it creates the assets once sequential builds for the same entry point
+             * (for example when multiple formats of same entry point are built),
+             * we need to reuse the same CSS created the first time.
+             */
+            if (jsAsset.facadeModuleId != null && jsAsset.isEntry && cssInjectionCode != '') {
+                if (jsAsset.facadeModuleId != previousFacadeModuleId) {
+                    globalCSSCodeEntryCache.clear();
+                }
+                previousFacadeModuleId = jsAsset.facadeModuleId;
+                globalCSSCodeEntryCache.set(jsAsset.facadeModuleId, cssInjectionCode);
+            }
+            if (cssInjectionCode == '' &&
+                jsAsset.isEntry &&
+                jsAsset.facadeModuleId != null &&
+                typeof globalCSSCodeEntryCache.get(jsAsset.facadeModuleId) == 'string') {
+                cssInjectionCode = globalCSSCodeEntryCache.get(jsAsset.facadeModuleId);
+            }
             process.env.VITE_CSS_INJECTED_BY_JS_DEBUG &&
@@ -188,0 +214,0 @@ debugLog(`[vite-plugin-css-injected-by-js] Global CSS inject: ${jsAsset.fileName}`);

dist/esm/utils.js

@@ -145,2 +145,4 @@ import { build } from 'vite';
 }
+const globalCSSCodeEntryCache = new Map();
+let previousFacadeModuleId = '';
 export async function globalCssInjection(bundle, cssAssets, buildCssCode, jsAssetsFilterFunction, topExecutionPriorityFlag) {
@@ -154,5 +156,29 @@ const jsTargetBundleKeys = getJsTargetBundleKeys(bundle, jsAssetsFilterFunction);
     const allCssCode = concatCssAndDeleteFromBundle(bundle, cssAssets);
-    const cssInjectionCode = allCssCode.length > 0 ? (await buildCssCode(allCssCode))?.code : '';
+    let cssInjectionCode = '';
+    if (allCssCode.length > 0) {
+        const cssCode = (await buildCssCode(allCssCode))?.code;
+        if (typeof cssCode == 'string') {
+            cssInjectionCode = cssCode;
+        }
+    }
     for (const jsTargetKey of jsTargetBundleKeys) {
         const jsAsset = bundle[jsTargetKey];
+        /**
+         * Since it creates the assets once sequential builds for the same entry point
+         * (for example when multiple formats of same entry point are built),
+         * we need to reuse the same CSS created the first time.
+         */
+        if (jsAsset.facadeModuleId != null && jsAsset.isEntry && cssInjectionCode != '') {
+            if (jsAsset.facadeModuleId != previousFacadeModuleId) {
+                globalCSSCodeEntryCache.clear();
+            }
+            previousFacadeModuleId = jsAsset.facadeModuleId;
+            globalCSSCodeEntryCache.set(jsAsset.facadeModuleId, cssInjectionCode);
+        }
+        if (cssInjectionCode == '' &&
+            jsAsset.isEntry &&
+            jsAsset.facadeModuleId != null &&
+            typeof globalCSSCodeEntryCache.get(jsAsset.facadeModuleId) == 'string') {
+            cssInjectionCode = globalCSSCodeEntryCache.get(jsAsset.facadeModuleId);
+        }
         process.env.VITE_CSS_INJECTED_BY_JS_DEBUG &&
@@ -159,0 +185,0 @@ debugLog(`[vite-plugin-css-injected-by-js] Global CSS inject: ${jsAsset.fileName}`);

package.json

 {
     "name": "vite-plugin-css-injected-by-js",
-    "version": "3.2.0",
+    "version": "3.2.1",
     "description": "A Vite plugin that takes the CSS and adds it to the page through the JS. For those who want a single JS file.",
@@ -5,0 +5,0 @@ "main": "dist/cjs/index.js",

README.md

@@ -252,2 +252,5 @@ # vite-plugin-css-injected-by-js 🤯
 
+**Set this option to `true` if you are using the multiple entry point option of Rollup.**
+_Future release can have an advanced behavior where this options will be configured to true automatically by sniffing user configurations._
+
 If a CSS code it's not injected inside some JS a warning will be showed.
@@ -254,0 +257,0 @@ To disable this warning set `suppressUnusedCssWarning` to `true`.

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

51116

increased by5.33%

Lines of code

731

increased by7.66%

Number of lines in readme file

283

increased by1.07%

No dependency changes