Release v1.0.0

wille · Sep 4, 2024 · bd2d0a3 · bd2d0a3
1 parent 2bc2d84
commit bd2d0a3
Show file tree

Hide file tree

Showing 6 changed files with 44 additions and 79 deletions.
diff --git a/README.md b/README.md
@@ -2,20 +2,15 @@
 
 # vite-preload
 
-This plugin will significantly speed up your server rendered vite application by preloading async modules as early as possible and it will avoid Flash Of Unstyled Content (FOUC) by including stylesheets from async modules in the initial HTML.
+This plugin will significantly speed up your server rendered vite application by preloading async modules and stylesheets as early as possible and help you avoiding Flash Of Unstyled Content (FOUC) by including stylesheets from async modules in the initial HTML.
 
 ## Explainer
 
 Vite supports `React.lazy()` and dynamic imports just fine but any lazy imported modules and its CSS imports will not be injected into html or DOM until the entrypoint module has imported them.
 
 It's a common pattern to have each page/route in your application lazy loaded especially if you are migrating to Vite from something else like webpack with loadable-components.
 
-This plugin will collect which modules are rendered on the server and help you inject `<link>` tags and `Link` preload headers for early hints.
-
-Read more:
-
-- [Backend Integration](https://vitejs.dev/guide/backend-integration.html)
-- [Server Side Rendering](https://vitejs.dev/guide/ssr.html)
+This plugin will collect which modules are rendered on the server and help you inject `<link>` tags in the HTML `<head>` and `Link` preload headers for [103 Early Hints](https://developer.mozilla.org/en-US/docs/Web/HTTP/Status/103)
 
 ## Without preloading
 
@@ -175,3 +170,9 @@ Card.preload();
 ### Using dynamic imports with react-router Lazy Routes
 
 See https://reactrouter.com/en/main/guides/ssr#lazy-routes
+
+
+### Read more:
+
+- [Backend Integration](https://vitejs.dev/guide/backend-integration.html)
+- [Server Side Rendering](https://vitejs.dev/guide/ssr.html)
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "vite-preload",
-  "version": "0.0.2",
-  "description": "Speed up your Vite application by preloading async modules and stylesheets as early as possible",
+  "version": "1.0.0",
+  "description": "Speed up your Vite application by preloading server rendered lazy modules and stylesheets as early as possible",
   "main": "dist/index.cjs",
   "module": "dist/index.js",
   "exports": {
@@ -23,7 +23,6 @@
     "./dist"
   ],
   "scripts": {
-    "prepare": "npm run build",
     "test": "tsc",
     "build": "rollup -c rollup.config.js"
   },
@@ -37,7 +36,6 @@
     "@rollup/plugin-typescript": "^11.1.6",
     "@types/babel__parser": "^7.0.0",
     "@types/babel__traverse": "^7.20.6",
-    "@types/debug": "^4.1.12",
     "@types/node": "^22.3.0",
     "@types/react": "^18.3.3",
     "prettier": "^3.3.3",
@@ -46,15 +44,22 @@
     "typescript": "^5.5.4"
   },
   "peerDependencies": {
-    "debug": "^4",
     "react": ">= 18",
-    "vite": "^5.4.0"
+    "vite": "^5"
   },
   "dependencies": {
     "@babel/generator": "^7.25.0",
     "@babel/parser": "^7.25.3",
     "@babel/traverse": "^7.25.3",
     "@babel/types": "^7.25.2",
     "mime": "^4.0.4"
-  }
+  },
+  "keywords": [
+    "react",
+    "css",
+    "ssr",
+    "esmodules",
+    "vite",
+    "vite-plugin"
+  ]
 }
diff --git a/src/collector.ts b/src/collector.ts
@@ -7,9 +7,6 @@ import {
     sortPreloads,
 } from './utils';
 import mime from 'mime';
-import debug from 'debug';
-
-const log = debug('vite-preload');
 
 interface ManifestChunk {
     src: string;

diff --git a/src/plugin.ts b/src/plugin.ts
@@ -17,6 +17,11 @@ interface PluginOptions {
      * Internal
      */
     __internal_importHelperModuleName?: string;
+
+    /**
+     * Enables extensive build logs
+     */
+    debug?: boolean;
 }
 
 const hookFunctionName = '__collectModule';
@@ -29,6 +34,7 @@ const includeJsx = /\.(jsx|tsx)$/;
 
 export default function preloadPlugin({
     __internal_importHelperModuleName = 'vite-preload/__internal',
+    debug,
 }: PluginOptions = {}): Plugin {
     const lazyImportedModules = new Set();
     const injectedModules = new Set();
@@ -90,9 +96,11 @@ export default function preloadPlugin({
                     continue;
                 }
 
-                this.info(
-                    `dynamically imports ${path.relative(process.cwd(), resolved.id)}`
-                );
+                if (debug) {
+                    this.info(
+                        `dynamically imports ${path.relative(process.cwd(), resolved.id)}`
+                    );
+                }
 
                 lazyImportedModules.add(resolved.id);
             }
@@ -138,7 +146,11 @@ export default function preloadPlugin({
                 });
 
                 if (injected) {
-                    this.info('Injected __collectModule in React component');
+                    if (debug) {
+                        this.info(
+                            'Injected __collectModule in React component'
+                        );
+                    }
                     count++;
                     const output = generate(ast, {}, code);
                     injectedModules.add(id);
@@ -153,9 +165,11 @@ export default function preloadPlugin({
         },
 
         buildEnd() {
-            const s = lazyImportedModules.difference(injectedModules);
-            for (const z of s) {
-                this.info(`${z} was not injected`);
+            if (debug) {
+                const s = lazyImportedModules.difference(injectedModules);
+                for (const z of s) {
+                    this.warn(`${z} was not injected`);
+                }
             }
             this.info(`${count} hook calls injected`);
         },

diff --git a/test.cjs b/test.cjs