fix: ignore animation parsing errors

closes #152, #153

Author: rigor789

package.json

@@ -34,12 +34,12 @@
   },
   "license": "MIT",
   "devDependencies": {
-    "@nativescript/webpack": "^5.0.5",
-    "postcss": "8.4.8",
-    "tailwindcss": "^3.0.23"
+    "@nativescript/webpack": "^5.0.8",
+    "postcss": "8.4.16",
+    "tailwindcss": "^3.1.8"
   },
   "dependencies": {
-    "@hookun/parse-animation-shorthand": "^0.1.2"
+    "@hookun/parse-animation-shorthand": "^0.1.4"
   },
   "peerDependencies": {
     "postcss": "^8.0.0"

src/expandAnimations.js

@@ -1,41 +1,45 @@
 const { parseSingle, serialize } = require("@hookun/parse-animation-shorthand");
 
 /**
- * @param {@} options 
+ * @param {@} options
  * @returns {import('postcss').Plugin}
  */
 module.exports = (options = { debug: false }) => {
   return {
     postcssPlugin: "postcss-nativescript-animations",
     Declaration(decl) {
-      // replace animation: *
-      // with    animation-*:
-      if (decl.prop === "animation") {
-        const styles = parseSingle(decl.value);
-        if (styles.duration && Number.isInteger(styles.duration)) {
-          styles.duration = `${styles.duration / 1000}s`;
-        }
-        Object.entries(styles)
-          .filter(([, value]) => typeof value === "object")
-          .map(([key, value]) => [
-            key,
-            serialize({ [key]: value }).split(" ")[0],
-          ])
-          .map(([key, value]) => (styles[key] = value));
+      try {
+        // replace animation: *
+        // with    animation-*:
+        if (decl.prop === "animation") {
+          const styles = parseSingle(decl.value);
+          if (styles.duration && Number.isInteger(styles.duration)) {
+            styles.duration = `${styles.duration / 1000}s`;
+          }
+          Object.entries(styles)
+            .filter(([, value]) => typeof value === "object")
+            .map(([key, value]) => [
+              key,
+              serialize({ [key]: value }).split(" ")[0],
+            ])
+            .map(([key, value]) => (styles[key] = value));
 
-        Object.entries(styles)
-          .filter(([, value]) => value !== "unset")
-          .map(([key, value]) =>
-            decl.parent.insertAfter(
-              decl,
-              decl.clone({
-                prop: `animation-${camelToKebab(key)}`,
-                value: `${value}`,
-              })
-            )
-          );
+          Object.entries(styles)
+            .filter(([, value]) => value !== "unset")
+            .map(([key, value]) =>
+              decl.parent.insertAfter(
+                decl,
+                decl.clone({
+                  prop: `animation-${camelToKebab(key)}`,
+                  value: `${value}`,
+                })
+              )
+            );
 
-        decl.remove();
+          decl.remove();
+        }
+      } catch (err) {
+        // ignore errors, and just keep the animation as-is
       }
     },
   };