posthtml-postcss - npm Package Compare versions

Comparing version 0.6.0 to 1.0.0

lib/index.js

@@ -1,41 +0,43 @@
-const postcss = require('postcss');
-const postcssrc = require('postcss-load-config');
+import postcss from 'postcss'
+import postcssConfig from 'postcss-load-config'
 
-module.exports = function (plugins, options, filterType) {
-  if (arguments.length === 0) {
-    const rc = postcssrc.sync();
-    plugins = rc.plugins;
-    options = rc.options;
+const plugin = (plugins = null, options = null, filterType = null) => {
+  if (plugins === null && options === null && filterType === null) {
+    const rc = postcssConfig.sync()
+    plugins = rc.plugins
+    options = rc.options
   }
 
-  plugins = [].concat(plugins).filter(Boolean);
-  options = options || {};
+  plugins = [].concat(plugins).filter(Boolean)
+  options = options || {}
 
-  const css = postcss(plugins);
+  const css = postcss(plugins)
 
   return function (tree) {
-    const promises = [];
+    const promises = []
 
     tree.walk(node => {
-      let promise;
+      let promise
 
       if (node.tag === 'style' && node.content) {
-        let meetsFilter = true;
+        let meetsFilter = true
+
         if (filterType) {
-          const typeAttr = (node.attrs && node.attrs.type) ? node.attrs.type.trim() : '';
-          const meetsTypeAttr = filterType.test(typeAttr);
-          const meetsStandardType = filterType.test('text/css') && (meetsTypeAttr || typeAttr === '');
-          const meetsOtherType = !meetsStandardType && meetsTypeAttr;
-          meetsFilter = meetsStandardType || meetsOtherType;
+          const typeAttr = (node.attrs && node.attrs.type) ? node.attrs.type.trim() : ''
+          const meetsTypeAttr = filterType.test(typeAttr)
+          const meetsStandardType = filterType.test('text/css') && (meetsTypeAttr || typeAttr === '')
+          const meetsOtherType = !meetsStandardType && meetsTypeAttr
+          meetsFilter = meetsStandardType || meetsOtherType
         }
 
         if (meetsFilter) {
-          const styles = [].concat(node.content).join('');
-          const from = options.from || tree.options.from;
+          const styles = [].concat(node.content).join('')
+          const from = options.from || tree.options.from
+
           promise = css.process(styles, {...options, from})
             .then(result => {
-              node.content = [result.css];
-            });
+              node.content = [result.css]
+            })
 
-          promises.push(promise);
+          promises.push(promise)
         }
@@ -47,15 +49,17 @@ }
           .then(result => {
-            node.attrs.style = result.css;
-          });
+            node.attrs.style = result.css
+          })
 
-        promises.push(promise);
+        promises.push(promise)
       }
 
-      return node;
-    });
+      return node
+    })
 
     return Promise.all(promises).then(() => {
-      return tree;
-    });
-  };
-};
+      return tree
+    })
+  }
+}
+
+export default plugin

package.json

 {
   "name": "posthtml-postcss",
-  "version": "0.6.0",
+  "version": "1.0.0",
   "description": "Use PostCSS with PostHTML",
@@ -10,5 +10,6 @@ "license": "MIT",
   "homepage": "https://github.com/posthtml/posthtml-postcss",
-  "main": "lib/index.js",
+  "type": "module",
+  "exports": "./lib/index.js",
   "engines": {
-    "node": ">=16"
+    "node": ">=18"
   },
@@ -15,0 +16,0 @@ "scripts": {

README.md

@@ -21,6 +21,8 @@ <div align="center">
 ```js
-const { readFileSync } = require('fs')
+import {dirname} from 'node:path'
+import {readFileSync} from 'node:fs'
+import {fileURLToPath} from 'node:url'
 
-const posthtml = require('posthtml')
-const postcss = require('posthtml-postcss')
+import posthtml from 'posthtml'
+import postcss from 'posthtml-postcss'
 
@@ -31,11 +33,16 @@ const postcssPlugins = []
 
+const __filename = fileURLToPath(import.meta.url)
+const __dirname = dirname(__filename)
+
 const filePath = `${__dirname}/index.html`
 const html = readFileSync(filePath, 'utf8')
 
-posthtml([ postcss(postcssPlugins, postcssOptions, filterType) ])
-    .process(html, { from: filePath })
-    .then((result) => console.log(result.html))
+posthtml([ 
+  postcss(postcssPlugins, postcssOptions, filterType) 
+])
+  .process(html, {from: filePath})
+  .then((result) => console.log(result.html))
 ```
 
-If you don't pass arguments to `posthtml-postcss`, it will use your project's PostCSS configuration (see [`postcss-load-config`](https://www.npmjs.com/package/postcss-load-config)).
+If you don't pass any arguments to `posthtml-postcss`, it will try to use your project's PostCSS configuration (see [`postcss-load-config`](https://www.npmjs.com/package/postcss-load-config)).
 
@@ -47,7 +54,8 @@ Notice that we're setting the option `from` when calling `process`. `posthtml-postcss` forwards this to PostCSS, which is useful for syntax error messages. (`postcss-cli` and `gulp-posthtml` are setting `from` automatically.)
 ```js
-const posthtml = require('posthtml')
-const postcss = require('posthtml-postcss')
+import posthtml from 'posthtml'
+import postcss from 'posthtml-postcss'
+import autoprefixer from 'autoprefixer'
 
 const postcssPlugins = [
-  require('autoprefixer')({ browsers: ['last 2 versions'] })
+  autoprefixer({ browsers: ['last 2 versions'] })
 ]
@@ -62,5 +70,7 @@ const postcssOptions = {}
 
-posthtml([ postcss(postcssPlugins, postcssOptions, filterType) ])
-    .process(html)
-    .then((result) => console.log(result.html))
+posthtml([ 
+  postcss(postcssPlugins, postcssOptions, filterType) 
+])
+  .process(html)
+  .then(result => console.log(result.html))
 ```
@@ -67,0 +77,0 @@

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

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

6884

increased by2.43%

Lines of code

49

increased by2.08%

Number of low quality alerts

0

decreased by-100%

Number of lines in readme file

93

increased by12.05%

Number of medium supply chain risk alerts

0

decreased by-100%

Is type module

Yes

No dependency changes