cessie - npm Package Compare versions

Comparing version 1.0.4 to 1.1.0

index.js

 const fs = require('fs');
+const watchFile = require('node-watch');
 const meow = require('meow');
@@ -9,2 +10,4 @@ const fileExtension = require('file-extension');
 
+require('log-timestamp');
+
 const cli = meow(`
@@ -17,2 +20,3 @@ Usage
       --minify,  -m Minify css. Defaults to true.
+      --watch,   -w Watch for file changes. Defaults to false.
 
@@ -32,2 +36,7 @@ Examples
             default: true
+        },
+        watch: {
+            type: 'boolean',
+            alias: 'w',
+            default: false
         }
@@ -89,3 +98,3 @@ }
 
-    const { outfile, minify } = cli.flags;
+    const { outfile, minify, watch } = cli.flags;
 
@@ -100,20 +109,33 @@ if (!inputFile) {
 
-    const inputCSS = await getFileContent(inputFile);
+    const generateCSS = async () => {
+        const inputCSS = await getFileContent(inputFile);
 
-    const toCSS = await transpile(inputCSS.toString(), inputFile);
+        const toCSS = await transpile(inputCSS.toString(), inputFile);
 
-    const { css } = await postcss([
-        require('postcss-css-variables')({ preserve: false }),
-        require('autoprefixer'),
-        require('postcss-calc'),
-        require('postcss-preset-env')
-    ]).process(toCSS, { from: false });
+        const { css } = await postcss([
+            require('postcss-css-variables')({ preserve: false }),
+            require('autoprefixer'),
+            require('postcss-calc'),
+            require('postcss-preset-env')
+        ]).process(toCSS, { from: false });
 
-    const outCSS = minify ? csso.minify(css).css : css;
+        return (minify && !watch) ? csso.minify(css).css : css;
+    };
 
-    await writeFileContent(outfile, outCSS);
+    if (watch) {
+        watchFile(inputFile, async (event, name) => {
+            console.log(` [*] Watching and writing ${inputFile} to ${outfile}`);
 
-    console.log(` [*] Finished writing file: ${outfile}`);
+            if (event === 'update' && inputFile === name) {
+                await writeFileContent(outfile, await generateCSS());
+            }
+
+        });
+    } else {
+        await writeFileContent(outfile, await generateCSS());
+
+        console.log(` [*] Finished writing file: ${outfile}`);
+    }
 }
 
 main();

package.json

 {
     "name": "cessie",
-    "version": "1.0.4",
+    "version": "1.1.0",
     "description": "Transpile your CSS bundle to support IE11 for CSS variables, calc, and future CSS.",
@@ -12,3 +12,9 @@ "main": "index.js",
     },
-    "keywords": ["ie11", "css variables", "css calc", "postcss", "transpile"],
+    "keywords": [
+        "ie11",
+        "css variables",
+        "css calc",
+        "postcss",
+        "transpile"
+    ],
     "author": "Bjarne Oeverli",
@@ -22,4 +28,6 @@ "license": "MIT",
         "less": "^3.9.0",
+        "log-timestamp": "^0.3.0",
         "meow": "^5.0.0",
         "node-sass": "^4.12.0",
+        "node-watch": "^0.6.2",
         "postcss": "^7.0.16",
@@ -26,0 +34,0 @@ "postcss-calc": "^7.0.1",

README.md

@@ -14,2 +14,3 @@ # cessie [css ie]
 - Can minify the output if not already minified.
+- Watch mode.
 
@@ -50,3 +51,4 @@
       --outfile, -o Name of the outfile
-      --minify,  -m Minify css. Defaults to true
+      --minify,  -m Minify css. Defaults to true.
+      --watch,   -w Watch for file changes. Defaults to false.
 
@@ -66,2 +68,3 @@ Examples
   --padding: 10px;
+  --border-color: #bad;
 }
@@ -77,2 +80,3 @@
     transition: opacity .15s ease-in-out;
+    border-radius: 1px solid var(--border-color);
 
@@ -90,2 +94,3 @@ .some-third-class {
         opacity: 0.5;
+        transform: scale(0.5);
     }
@@ -101,2 +106,3 @@ }
 }
+
 ```
@@ -106,3 +112,3 @@
 ```
-$ cessie mybundle.less -o ie11.css -m false
+$ cessie mybundle.less -o output.css -m false
 ```
@@ -120,2 +126,3 @@
   transition: opacity 0.15s ease-in-out;
+  border-radius: 1px solid #bad;
 }
@@ -129,2 +136,4 @@ button .some-third-class {
   opacity: 0.5;
+  -webkit-transform: scale(0.5);
+          transform: scale(0.5);
 }
@@ -135,2 +144,3 @@ div {
 }
+
 ```
@@ -140,3 +150,2 @@
 ## Todo
-- Watch mode
 - Source map
@@ -143,0 +152,0 @@

No alert changes

Improved metrics

Total package byte prevSize

8370

increased by14.61%

Lines of code

110

increased by20.88%

Number of lines in readme file

151

increased by6.34%

Worsened metrics

Dependency count

12

increased by20%

Dependency changes

• + Addedlog-timestamp@^0.3.0

• + Addednode-watch@^0.6.2

• + Addedlog-prefix@0.1.1(transitive)

• + Addedlog-timestamp@0.3.0(transitive)

• + Addednode-watch@0.6.4(transitive)