esbuild-sass-plugin - npm Package Compare versions

Comparing version 1.0.0 to 1.0.1

package.json

 {
   "name": "esbuild-sass-plugin",
-  "version": "1.0.0",
-  "description": "",
-  "main": "index.js",
-  "keywords": [],
-  "author": "",
+  "version": "1.0.1",
+  "description": "esbuild plugin for sass/scss files supporting both css loader and css result import (lit-element)",
+  "main": "lib/index.js",
+  "keywords": [
+    "esbuild",
+    "plugin",
+    "sass",
+    "scss",
+    "LICENSE",
+    "README.MD",
+    "tsconfig.json"
+  ],
+  "files": [
+    "lib",
+    "src",
+    "test"
+  ],
+  "author": "Gianluca Romeo <[e-mail]> (https://github.com/glromeo/esbuild-sass-plugin)",
   "license": "ISC",
+  "bugs": {
+    "url": "https://github.com/glromeo/esbuild-sass-plugin/issues"
+  },
+  "homepage": "https://github.com/glromeo/esbuild-sass-plugin#readme",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/glromeo/esbuild-sass-plugin.git"
+  },
   "scripts": {
@@ -10,0 +31,0 @@ "setup": "cd test/fixture && yarn install && cd ../..",

README.md

@@ -1,2 +0,38 @@
-# esbuild-sass-plugin
-esbuild plugin for sass
+![logo created with https://cooltext.com](https://images.cooltext.com/5500652.png)
+
+A plugin for [esbuild](https://esbuild.github.io/) to handle sass & scss files.
+##### Main Features
+* css loader
+* css result modules or dynamic style added to main page
+* uses [dart sass](https://www.npmjs.com/package/sass)
+
+### Install
+```bash
+npm i esbuild-sass-plugin
+```
+
+### Usage
+Just add it to the esbuild plugins:
+```javascript
+import {sassPlugin} from "esbuild-sass-plugin";
+
+await esbuild.build({
+    ...
+    plugins: [sassPlugin({
+        format: "lit-css",
+        ... // other options for sass.renderSync(...)
+    })]
+});
+```
+look in the `test` folder for more usage examples.
+
+The **options** passed to the plugin are a superset of the sass [Options](https://sass-lang.com/documentation/js-api#options).
+
+### TODO:
+
+* sass import resolution
+
+### Benchmarks
+```
+... coming soon
+```

src/index.ts

@@ -5,6 +5,24 @@ import {Plugin} from "esbuild";
 
-export type SassPluginOptions = {}
+export type SassPluginOptions = Options & {
+    format?: "lit-css" | undefined
+}
 
-export function sassPlugin(options: SassPluginOptions): Plugin {
-    const sassOption: Options = {};
+const cssResultModule = cssText => `\
+import {css} from "lit-element";
+export default css\`
+${cssText.replace(/([$`\\])/g, "\\$1")}\`;
+`;
+
+const styleModule = cssText => `\
+document.head
+    .appendChild(document.createElement("style"))
+    .appendChild(document.createTextNode(\`
+${cssText.replace(/([$`\\])/g, "\\$1")}\`));
+`;
+
+function makeModule(contents: string, format: "lit-css"|"style"|undefined) {
+    return format === "style" ? styleModule(contents) : cssResultModule(contents);
+}
+
+export function sassPlugin(options: SassPluginOptions = {}): Plugin {
     return {
@@ -18,7 +36,11 @@ name: "sass-plugin",
                 const {css} = renderSync({
-                    ...sassOption,
+                    ...options,
                     file: args.path
                 });
                 const contents = css.toString("utf-8");
-                return {contents: contents, loader: "css"};
+                if (options.format) {
+                    return {contents: makeModule(contents, options.format), loader: "js", resolveDir: path.dirname(args.path)};
+                } else {
+                    return {contents: contents, loader: "css"};
+                }
             });
@@ -25,0 +47,0 @@ }

test/fixture/package.json

@@ -8,4 +8,5 @@ {
   "workspaces": [
-    "react"
+    "react",
+    "lit-element"
   ]
 }

test/using-css-loader.test.ts

@@ -31,2 +31,3 @@ import {expect} from "chai";
     });
+
 });

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

No contributors or author data

Maintenance

Package does not specify a list of contributors or an author in package.json.

Found 1 instance in 1 package

No bug tracker

Maintenance

Package does not have a linked bug tracker in package.json.

Found 1 instance in 1 package

No repository

Supply chain risk

Package does not have a linked source code repository. Without this field, a package will have no reference to the location of the source code use to generate the package.

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

3203272

increased by8.62%

Number of package files

27

increased by42.11%

Lines of code

50402

increased by3.29%

Number of low maintenance alerts

0

decreased by-100%

Number of low quality alerts

0

decreased by-100%

Number of lines in readme file

39

increased by1200%

Number of low supply chain risk alerts

0

decreased by-100%

No dependency changes