diff --git a/core/package-lock.json b/core/package-lock.json
index 616d6b54c7..7b7d876478 100644
--- a/core/package-lock.json
+++ b/core/package-lock.json
@@ -1,6 +1,6 @@
 {
   "name": "@ionic/core",
-  "version": "5.4.0-dev.202009101933.5ffa65f",
+  "version": "5.4.0-dev.202009151947.352e16b",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {
@@ -1385,9 +1385,9 @@
       "dev": true
     },
     "@stencil/vue-output-target": {
-      "version": "0.1.2",
-      "resolved": "https://registry.npmjs.org/@stencil/vue-output-target/-/vue-output-target-0.1.2.tgz",
-      "integrity": "sha512-UgaDR1PHqWO5XE41NK6YGj3IZLfnZQry0mxilnMHEegCdhp7dMrG4VaRw35BFbgnL9rRYJ0xvpergYkoT946uA==",
+      "version": "0.1.3",
+      "resolved": "https://registry.npmjs.org/@stencil/vue-output-target/-/vue-output-target-0.1.3.tgz",
+      "integrity": "sha512-+X1/gjiHh88Q+sQ9EWEHb4PIQs0k4pjTYxqsjqF5Yq9oaQGOPoKzOzjiIs2PEcE0fB6yu/dtRNQUUsBo613dpA==",
       "dev": true
     },
     "@stylelint/postcss-css-in-js": {
diff --git a/core/package.json b/core/package.json
index 2962da77f6..a9d3973c7b 100644
--- a/core/package.json
+++ b/core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@ionic/core",
-  "version": "5.4.0-dev.202009101933.5ffa65f",
+  "version": "5.4.0-dev.202009151947.352e16b",
   "description": "Base components for Ionic",
   "keywords": [
     "ionic",
@@ -38,7 +38,7 @@
     "@rollup/plugin-virtual": "^2.0.3",
     "@stencil/core": "1.17.3",
     "@stencil/sass": "1.3.2",
-    "@stencil/vue-output-target": "0.1.2",
+    "@stencil/vue-output-target": "0.1.3",
     "@types/jest": "^26.0.10",
     "@types/node": "^14.6.0",
     "@types/puppeteer": "3.0.1",
diff --git a/packages/vue/src/vue-component-lib/utils.ts b/packages/vue/src/vue-component-lib/utils.ts
index 1f0928ce44..de6a7b8b7d 100644
--- a/packages/vue/src/vue-component-lib/utils.ts
+++ b/packages/vue/src/vue-component-lib/utils.ts
@@ -20,9 +20,13 @@ interface ComponentOptions {
   routerLinkComponent?: boolean;
 }
 
-const getElementClasses = (ref: Ref<HTMLElement | undefined>, componentClasses: string[], defaultClasses: string[] = []) => {
+const getComponentClasses = (classes: unknown) => {
+  return (classes as string)?.split(' ') || [];
+};
+
+const getElementClasses = (ref: Ref<HTMLElement | undefined>, componentClasses: Set<string>, defaultClasses: string[] = []) => {
   return [ ...Array.from(ref.value?.classList || []), ...defaultClasses ]
-    .filter((c: string, i, self) => !componentClasses.includes(c) && self.indexOf(c) === i);
+    .filter((c: string, i, self) => !componentClasses.has(c) && self.indexOf(c) === i);
 };
 
 /**
@@ -47,7 +51,7 @@ export const defineContainer = <Props extends object>(name: string, componentPro
   const Container: FunctionalComponent<Props & InputProps> = defineComponent((props, { attrs, slots, emit }) => {
     const { modelValue, ...restOfProps } = props;
     const containerRef = ref<HTMLElement>();
-    const classes: string[] = (attrs.class as string)?.split(' ') || [];
+    const classes = new Set(getComponentClasses(attrs.class));
     const onVnodeBeforeMount = (vnode: VNode) => {
       // Add a listener to tell Vue to update the v-model
       if (vnode.el) {
@@ -86,6 +90,10 @@ export const defineContainer = <Props extends object>(name: string, componentPro
     }
 
     return () => {
+      getComponentClasses(attrs.class).forEach(value => {
+        classes.add(value);
+      });
+
       let propsToAdd = {
         ...finalProps,
         ref: containerRef,