diff --git a/dist/alpine-ie11.js b/dist/alpine-ie11.js
index 3a94d75bd..80ba28562 100644
--- a/dist/alpine-ie11.js
+++ b/dist/alpine-ie11.js
@@ -6528,7 +6528,7 @@
       } else {
         var _originalClasses = el.__x_original_classes || [];
 
-        var newClasses = convertClassStringToArray(value);
+        var newClasses = value ? convertClassStringToArray(value) : [];
         el.setAttribute('class', arrayUnique(_originalClasses.concat(newClasses)).join(' '));
       }
     } else {
diff --git a/dist/alpine.js b/dist/alpine.js
index b037094a1..b8a8b0265 100644
--- a/dist/alpine.js
+++ b/dist/alpine.js
@@ -686,7 +686,7 @@
         });
       } else {
         const originalClasses = el.__x_original_classes || [];
-        const newClasses = convertClassStringToArray(value);
+        const newClasses = value ? convertClassStringToArray(value) : [];
         el.setAttribute('class', arrayUnique(originalClasses.concat(newClasses)).join(' '));
       }
     } else {
diff --git a/src/directives/bind.js b/src/directives/bind.js
index d7e6ecc99..06f57a662 100644
--- a/src/directives/bind.js
+++ b/src/directives/bind.js
@@ -62,7 +62,7 @@ export function handleAttributeBindingDirective(component, el, attrName, express
             })
         } else {
             const originalClasses = el.__x_original_classes || []
-            const newClasses = convertClassStringToArray(value)
+            const newClasses = value ? convertClassStringToArray(value) : []
             el.setAttribute('class', arrayUnique(originalClasses.concat(newClasses)).join(' '))
         }
     } else {
diff --git a/test/bind.spec.js b/test/bind.spec.js
index e90d1025e..d092e7c25 100644
--- a/test/bind.spec.js
+++ b/test/bind.spec.js
@@ -484,6 +484,24 @@ test('extra whitespace in class binding string syntax is ignored', async () => {
     expect(document.querySelector('span').classList.contains('bar')).toBeTruthy()
 })
 
+test('undefined class binding resolves to empty string', async () => {
+    jest.spyOn(window, 'setTimeout').mockImplementation((callback,time) => {
+        callback()
+    });
+
+    document.body.innerHTML = `
+        <div x-data="{ errorClass: (hasError) => { if (hasError) { return 'red' } } }">
+            <span id="error" x-bind:class="errorClass(true)">should be red</span>
+            <span id="empty" x-bind:class="errorClass(false)">should be empty</span>
+        </div>
+    `
+
+    await expect(Alpine.start()).resolves.toBeUndefined()
+
+    expect(document.querySelector('#error').classList.value).toEqual('red')
+    expect(document.querySelector('#empty').classList.value).toEqual('')
+})
+
 test('.camel modifier correctly sets name of attribute', async () => {
     document.body.innerHTML = `
         <div x-data>