esbuild-css-modules-server-plugin - npm Package Compare versions

Comparing version 0.1.2 to 0.1.3

package.json

 {
   "name": "esbuild-css-modules-server-plugin",
-  "version": "0.1.2",
+  "version": "0.1.3",
   "description": "esbuild plugin for bundling CSS module files for server-side rendering",
@@ -13,3 +13,3 @@ "keywords": [
   ],
-  "homepage": "",
+  "homepage": "https://github.com/goldstack/goldstack/tree/master/workspaces/utils/packages/esbuild-css-modules-server-plugin#readme",
   "bugs": {
@@ -40,3 +40,3 @@ "url": "https://github.com/goldstack/goldstack/issues"
   "dependencies": {
-    "node-css-require": "0.1.1",
+    "node-css-require": "0.1.2",
     "postcss-modules-sync": "^1.0.0"
@@ -43,0 +43,0 @@ },

README.md

@@ -0,1 +1,3 @@
+[![npm version](https://badge.fury.io/js/esbuild-css-modules-server-plugin.svg)](https://badge.fury.io/js/esbuild-css-modules-server-plugin)
+
 # esbuild CSS Modules Plugin (Server)
@@ -11,2 +13,4 @@
 
+For creating client-side bundles, see [`esbuild-css-modules-client-plugin`](https://www.npmjs.com/package/esbuild-css-modules-client-plugin)
+
 ## Usage
@@ -32,2 +36,24 @@
 
+### Options
+
+The plugin supports one option `onCSSGenerated`. This option accepts a callback function that receives one argument `css` that contains snippets of CSS generated.
+
+```typescript
+import cssPlugin from 'esbuild-css-modules-server-plugin';
+
+const generatedCss: string[] = [];
+const res = await build({
+  plugins: [
+    cssPlugin({
+      onCSSGenerated: (css) => {
+        generatedCss.push(css);
+      },
+    }),
+  ],
+});
+console.log(generatedCss.join('\n'));
+```
+
+This can be useful for creating a CSS bundle that can be shipped with the other files packaged for the server. When generating a client-side bundle using [`esbuild-css-modules-client-plugin`](https://www.npmjs.com/package/esbuild-css-modules-client-plugin), the option `excludeCSSInject` can then be set to true for a better page load experience (no flicker of the page once CSS is injected).
+
 ## How does it work?
@@ -40,1 +66,6 @@
 Thus, when server-side rendering is performed, class names can be resolved to the transformed counter-parts and the HTML rendered with the correct class names.
+
+## See also
+
+- [`esbuild-plugin-css-in-js`](https://github.com/karishmashuklaa/esbuild-plugin-css-in-js): Plugin that includes plain CSS (instead of CSS with transformed classnames according to the CSS modules standard as this plugin does)
+- [`node-css-require`](https://www.npmjs.com/package/node-css-require): Library used for CSS module transformation

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

No website

Quality

Package does not have a website.

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

No website

Quality

Package does not have a website.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

7151

increased by29.43%

Number of lines in readme file

69

increased by81.58%

Dependency changes

• + Addednode-css-require@0.1.2(transitive)

• - Removednode-css-require@0.1.1(transitive)

• Updatednode-css-require@0.1.2