diff --git a/packages/Webkul/Velocity/src/Resources/views/admin/category/create.blade.php b/packages/Webkul/Velocity/src/Resources/views/admin/category/create.blade.php
index 62b1526e2..587efe206 100644
--- a/packages/Webkul/Velocity/src/Resources/views/admin/category/create.blade.php
+++ b/packages/Webkul/Velocity/src/Resources/views/admin/category/create.blade.php
@@ -47,7 +47,7 @@
                                     @endforeach
                                 </select>
 
-                                <span class="control-error" v-if="errors.has('category_id')">@{{ errors.first('category_id') }}</span>
+                                <span class="control-error" v-if="errors.has('category_id')" v-text="errors.first('category_id')"></span>
                             </div>
 
                             <div class="control-group" :class="[errors.has('icon') ? 'has-error' : '']">
@@ -57,7 +57,7 @@
 
                                 <input type="text" v-validate="'required'" class="control" id="icon" name="icon" data-vv-as="&quot;{{ __('velocity::app.admin.category.icon-class') }}&quot;" />
 
-                                <span class="control-error" v-if="errors.has('icon')">@{{ errors.first('icon') }}</span>
+                                <span class="control-error" v-if="errors.has('icon')" v-text="errors.first('icon')"></span>
                             </div>
 
                             <div class="control-group" :class="[errors.has('tooltip') ? 'has-error' : '']">
@@ -67,7 +67,7 @@
 
                                 <textarea v-validate="'max:250'" class="control" id="tooltip" name="tooltip" data-vv-as="&quot;{{ __('velocity::app.admin.category.tooltip-content') }}&quot;"></textarea>
 
-                                <span class="control-error" v-if="errors.has('tooltip')">@{{ errors.first('tooltip') }}</span>
+                                <span class="control-error" v-if="errors.has('tooltip')" v-text="errors.first('tooltip')"></span>
                             </div>
 
                             <div class="control-group" :class="[errors.has('status') ? 'has-error' : '']">
@@ -80,7 +80,7 @@
                                         {{ __('velocity::app.admin.category.inactive') }}
                                     </option>
                                 </select>
-                                <span class="control-error" v-if="errors.has('status')">@{{ errors.first('status') }}</span>
+                                <span class="control-error" v-if="errors.has('status')" v-text="errors.first('status')"></span>
                             </div>
 
                         {!! view_render_event('bagisto.admin.category.create_form_accordian.general.content.after') !!}
diff --git a/packages/Webkul/Velocity/src/Resources/views/admin/category/edit.blade.php b/packages/Webkul/Velocity/src/Resources/views/admin/category/edit.blade.php
index 5871c66e7..bfce3a04a 100644
--- a/packages/Webkul/Velocity/src/Resources/views/admin/category/edit.blade.php
+++ b/packages/Webkul/Velocity/src/Resources/views/admin/category/edit.blade.php
@@ -48,7 +48,7 @@
                                     @endforeach
                                 </select>
 
-                                <span class="control-error" v-if="errors.has('category_id')">@{{ errors.first('category_id') }}</span>
+                                <span class="control-error" v-if="errors.has('category_id')" v-text="errors.first('category_id')"></span>
                             </div>
 
                             <div class="control-group" :class="[errors.has('icon') ? 'has-error' : '']">
@@ -58,7 +58,7 @@
 
                                 <input type="text" v-validate="'required'" class="control" id="icon" name="icon" value="{{ $velocityCategory->icon }}" data-vv-as="&quot;{{ __('velocity::app.admin.category.icon-class') }}&quot;" />
 
-                                <span class="control-error" v-if="errors.has('icon')">@{{ errors.first('icon') }}</span>
+                                <span class="control-error" v-if="errors.has('icon')" v-text="errors.first('icon')"></span>
                             </div>
 
                             <div class="control-group" :class="[errors.has('tooltip') ? 'has-error' : '']">
@@ -68,7 +68,7 @@
 
                                 <textarea v-validate="'max:250'" class="control" id="tooltip" name="tooltip" data-vv-as="&quot;{{ __('velocity::app.admin.category.tooltip-content') }}&quot;">{{ $velocityCategory->tooltip }}</textarea>
 
-                                <span class="control-error" v-if="errors.has('tooltip')">@{{ errors.first('tooltip') }}</span>
+                                <span class="control-error" v-if="errors.has('tooltip')" v-text="errors.first('tooltip')"></span>
                             </div>
 
                             <div class="control-group" :class="[errors.has('status') ? 'has-error' : '']">
@@ -81,7 +81,7 @@
                                         {{ __('velocity::app.admin.category.inactive') }}
                                     </option>
                                 </select>
-                                <span class="control-error" v-if="errors.has('status')">@{{ errors.first('status') }}</span>
+                                <span class="control-error" v-if="errors.has('status')" v-text="errors.first('status')"></span>
                             </div>
 
                         {!! view_render_event('bagisto.admin.category.edit_form_accordian.general.content.after', ['velocityCategory' => $velocityCategory]) !!}
diff --git a/packages/Webkul/Velocity/src/Resources/views/admin/content/content-type/category.blade.php b/packages/Webkul/Velocity/src/Resources/views/admin/content/content-type/category.blade.php
index 146949530..58152ca00 100644
--- a/packages/Webkul/Velocity/src/Resources/views/admin/content/content-type/category.blade.php
+++ b/packages/Webkul/Velocity/src/Resources/views/admin/content/content-type/category.blade.php
@@ -20,9 +20,7 @@
         @input="$event.target.value=$event.target.value.toLowerCase()"
         data-vv-as="&quot;{{ __('velocity::app.admin.contents.content.category-slug') }}&quot;" />
 
-    <span class="control-error" v-if="errors.has('{!!$locale!!}[page_link]')">
-        @{{ errors.first('{!!$locale!!}[page_link]') }}
-    </span>
+    <span class="control-error" v-if="errors.has('{!!$locale!!}[page_link]')" v-text="errors.first('{!!$locale!!}[page_link]')"></span>
 </div>
 
 <div class="control-group">
diff --git a/packages/Webkul/Velocity/src/Resources/views/admin/content/content-type/edit-product.blade.php b/packages/Webkul/Velocity/src/Resources/views/admin/content/content-type/edit-product.blade.php
index 02ed70b80..8eb1799dd 100644
--- a/packages/Webkul/Velocity/src/Resources/views/admin/content/content-type/edit-product.blade.php
+++ b/packages/Webkul/Velocity/src/Resources/views/admin/content/content-type/edit-product.blade.php
@@ -20,7 +20,7 @@
                     @endforeach
                 </select>
 
-                <span class="control-error" v-if="errors.has('{{$locale}}[catalog_type]')">@{{ errors.first('{!!$locale!!}[catalog_type]') }}</span>
+                <span class="control-error" v-if="errors.has('{{$locale}}[catalog_type]')" v-text="errors.first('{!!$locale!!}[catalog_type]')"></span>
             </div>
 
             <div v-if="catalog_type == 'custom'">
diff --git a/packages/Webkul/Velocity/src/Resources/views/admin/content/content-type/link.blade.php b/packages/Webkul/Velocity/src/Resources/views/admin/content/content-type/link.blade.php
index 9a97d5784..6480688bf 100644
--- a/packages/Webkul/Velocity/src/Resources/views/admin/content/content-type/link.blade.php
+++ b/packages/Webkul/Velocity/src/Resources/views/admin/content/content-type/link.blade.php
@@ -5,12 +5,12 @@
         <label for="page_link" class="required">{{ __('velocity::app.admin.contents.content.page-link') }}</label>
         <input type="text" v-validate="'required|max:150'" class="control" id="page_link" name="page_link" value="" data-vv-as="&quot;{{ __('velocity::app.admin.contents.content.page-link') }}&quot;"/>
 
-        <span class="control-error" v-if="errors.has('page_link')">@{{ errors.first('page_link') }}</span>
+        <span class="control-error" v-if="errors.has('page_link')" v-text="errors.first('page_link')"></span>
     </div>
 
     <div class="control-group">
         <label for="link_target">{{ __('velocity::app.admin.contents.content.link-target') }}</label>
-        
+
         <select class="control" id="link_target" name="link_target" value="">
             <option value="0">
                 {{ __('velocity::app.admin.contents.self') }}
diff --git a/packages/Webkul/Velocity/src/Resources/views/admin/content/content-type/product.blade.php b/packages/Webkul/Velocity/src/Resources/views/admin/content/content-type/product.blade.php
index d59d3cabd..509da2934 100644
--- a/packages/Webkul/Velocity/src/Resources/views/admin/content/content-type/product.blade.php
+++ b/packages/Webkul/Velocity/src/Resources/views/admin/content/content-type/product.blade.php
@@ -18,7 +18,7 @@
                     @endforeach
                 </select>
 
-                <span class="control-error" v-if="errors.has('catalog_type')">@{{ errors.first('catalog_type') }}</span>
+                <span class="control-error" v-if="errors.has('catalog_type')" v-text="errors.first('catalog_type')"></span>
             </div>
 
             <div v-if="catalog_type == 'custom'">
diff --git a/packages/Webkul/Velocity/src/Resources/views/admin/content/content-type/static.blade.php b/packages/Webkul/Velocity/src/Resources/views/admin/content/content-type/static.blade.php
index d44eae558..6b66a0ff0 100644
--- a/packages/Webkul/Velocity/src/Resources/views/admin/content/content-type/static.blade.php
+++ b/packages/Webkul/Velocity/src/Resources/views/admin/content/content-type/static.blade.php
@@ -1,11 +1,11 @@
 {!! view_render_event('bagisto.admin.content.create_form_accordian.content.static.before') !!}
-    
+
     <div class="control-group" :class="[errors.has('description') ? 'has-error' : '']">
         <label for="description" class="required">{{ __('velocity::app.admin.contents.content.static-description') }}</label>
-        
-        <textarea v-validate="'required'" class="control" id="description" name="description" data-vv-as="&quot;{{ __('velocity::app.admin.contents.content.static-description') }}&quot;"></textarea> 
 
-        <span class="control-error" v-if="errors.has('description')">@{{ errors.first('description') }}</span>
+        <textarea v-validate="'required'" class="control" id="description" name="description" data-vv-as="&quot;{{ __('velocity::app.admin.contents.content.static-description') }}&quot;"></textarea>
+
+        <span class="control-error" v-if="errors.has('description')" v-text="errors.first('description')"></span>
     </div>
-    
+
 {!! view_render_event('bagisto.admin.content.create_form_accordian.content.static.after') !!}
\ No newline at end of file
diff --git a/packages/Webkul/Velocity/src/Resources/views/admin/content/create.blade.php b/packages/Webkul/Velocity/src/Resources/views/admin/content/create.blade.php
index 2569e3db1..a0cb4a5dc 100644
--- a/packages/Webkul/Velocity/src/Resources/views/admin/content/create.blade.php
+++ b/packages/Webkul/Velocity/src/Resources/views/admin/content/create.blade.php
@@ -44,7 +44,7 @@
                                 {{ __('velocity::app.admin.contents.page.title') }}
                             </label>
                             <input type="text" v-validate="'required|max:100'" class="control" id="title" name="title" value="" data-vv-as="&quot;{{ __('velocity::app.admin.contents.page.title') }}&quot;"/>
-                            <span class="control-error" v-if="errors.has('title')">@{{ errors.first('title') }}</span>
+                            <span class="control-error" v-if="errors.has('title')" v-text="errors.first('title')"></span>
                         </div>
 
                         <div class="control-group" :class="[errors.has('position') ? 'has-error' : '']">
@@ -52,7 +52,7 @@
                                 {{ __('velocity::app.admin.contents.page.position') }}</span>
                             </label>
                             <input type="text" v-validate="'required|numeric|max:2'" class="control" id="position" name="position" value="" data-vv-as="&quot;{{ __('velocity::app.admin.contents.page.position') }}&quot;"/>
-                            <span class="control-error" v-if="errors.has('position')">@{{ errors.first('position') }}</span>
+                            <span class="control-error" v-if="errors.has('position')" v-text="errors.first('position')"></span>
                         </div>
 
                         <div class="control-group" :class="[errors.has('status') ? 'has-error' : '']">
@@ -65,7 +65,7 @@
                                     {{ __('velocity::app.admin.contents.inactive') }}
                                 </option>
                             </select>
-                            <span class="control-error" v-if="errors.has('status')">@{{ errors.first('status') }}</span>
+                            <span class="control-error" v-if="errors.has('status')" v-text="errors.first('status')"></span>
                         </div>
 
                         {!! view_render_event('bagisto.admin.content.create_form_accordian.page.controls.after') !!}
@@ -108,7 +108,7 @@
                 </label>
                 <input type="text" v-validate="'max:100'" class="control" id="custom_title" name="custom_title" value="" data-vv-as="&quot;{{ __('velocity::app.admin.contents.content.custom-title') }}&quot;"/>
 
-                <span class="control-error" v-if="errors.has('custom_title')">@{{ errors.first('custom_title') }}</span>
+                <span class="control-error" v-if="errors.has('custom_title')" v-text="errors.first('custom_title')"></span>
             </div>
 
             <div class="control-group" :class="[errors.has('custom_heading') ? 'has-error' : '']">
@@ -117,7 +117,7 @@
                 </label>
                 <input type="text" v-validate="'max:100'" class="control" id="custom_heading" name="custom_heading" value="" data-vv-as="&quot;{{ __('velocity::app.admin.contents.content.custom-heading') }}&quot;"/>
 
-                <span class="control-error" v-if="errors.has('custom_heading')">@{{ errors.first('custom_heading') }}</span>
+                <span class="control-error" v-if="errors.has('custom_heading')" v-text="errors.first('custom_heading')"></span>
             </div> --}}
 
             <div class="control-group" :class="[errors.has('content_type') ? 'has-error' : '']">
@@ -131,7 +131,7 @@
                     @endforeach
                 </select>
 
-                <span class="control-error" v-if="errors.has('content_type')">@{{ errors.first('content_type') }}</span>
+                <span class="control-error" v-if="errors.has('content_type')" v-text="errors.first('content_type')"></span>
             </div>
 
             <div v-if="content_type == 'link'">
diff --git a/packages/Webkul/Velocity/src/Resources/views/admin/content/edit.blade.php b/packages/Webkul/Velocity/src/Resources/views/admin/content/edit.blade.php
index 5df3ce7c0..8607b6011 100644
--- a/packages/Webkul/Velocity/src/Resources/views/admin/content/edit.blade.php
+++ b/packages/Webkul/Velocity/src/Resources/views/admin/content/edit.blade.php
@@ -64,7 +64,7 @@
                             </label>
                             <input type="text" v-validate="'required|max:100'" class="control" id="title" name="{{$locale}}[title]" value="{{ old($locale)['title'] ?? isset($translation->title) ? $translation->title : '' }}" data-vv-as="&quot;{{ __('velocity::app.admin.contents.page.title') }}&quot;"/>
 
-                            <span class="control-error" v-if="errors.has('{{$locale}}[title]')">@{{ errors.first('{!!$locale!!}[title]') }}</span>
+                            <span class="control-error" v-if="errors.has('{{$locale}}[title]')" v-text="errors.first('{!!$locale!!}[title]')"></span>
                         </div>
 
                         <div class="control-group" :class="[errors.has('position') ? 'has-error' : '']">
@@ -72,7 +72,7 @@
                                 {{ __('velocity::app.admin.contents.page.position') }}</span>
                             </label>
                             <input type="text" v-validate="'required|numeric|max:2'" class="control" id="position" name="position" value="{{ old('position') ?? $content->position }}" data-vv-as="&quot;{{ __('velocity::app.admin.contents.page.position') }}&quot;"/>
-                            <span class="control-error" v-if="errors.has('position')">@{{ errors.first('position') }}</span>
+                            <span class="control-error" v-if="errors.has('position')" v-text="errors.first('position')"></span>
                         </div>
 
                         <div class="control-group" :class="[errors.has('status') ? 'has-error' : '']">
@@ -85,7 +85,7 @@
                                     {{ __('velocity::app.admin.contents.active') }}
                                 </option>
                             </select>
-                            <span class="control-error" v-if="errors.has('status')">@{{ errors.first('status') }}</span>
+                            <span class="control-error" v-if="errors.has('status')" v-text="errors.first('status')"></span>
                         </div>
 
                         {!! view_render_event('bagisto.admin.content.edit_form_accordian.page.controls.after', ['content' => $content]) !!}
@@ -140,8 +140,8 @@
 
                 <span
                     class="control-error"
-                    v-if="errors.has('{{$locale}}[custom_title]')">
-                    @{{ errors.first('{!!$locale!!}[custom_title]') }}
+                    v-if="errors.has('{{$locale}}[custom_title]')"
+                    v-text="errors.first('{!!$locale!!}[custom_title]')">
                 </span>
             </div>
 
@@ -161,8 +161,8 @@
 
                 <span
                     class="control-error"
-                    v-if="errors.has('{{$locale}}[custom_heading]')">
-                    @{{ errors.first('{!!$locale!!}[custom_heading]') }}
+                    v-if="errors.has('{{$locale}}[custom_heading]')"
+                    v-text="errors.first('{!!$locale!!}[custom_heading]')">
                 </span>
             </div> --}}
 
@@ -200,8 +200,8 @@
 
                 <span
                     class="control-error"
-                    v-if="errors.has('content_type')">
-                    @{{ errors.first('content_type') }}
+                    v-if="errors.has('content_type')"
+                    v-text="errors.first('content_type')">
                 </span>
             </div>
 
@@ -225,8 +225,8 @@
 
                     <span
                         class="control-error"
-                        v-if="errors.has('{{$locale}}[page_link]')">
-                        @{{ errors.first('{!!$locale!!}[page_link]') }}
+                        v-if="errors.has('{{$locale}}[page_link]')"
+                        v-text="errors.first('{!!$locale!!}[page_link]')">
                     </span>
                 </div>
 
@@ -272,8 +272,8 @@
 
                     <span
                         class="control-error"
-                        v-if="errors.has('{{$locale}}[description]')">
-                        @{{ errors.first('{!!$locale!!}[description]') }}
+                        v-if="errors.has('{{$locale}}[description]')"
+                        v-text="errors.first('{!!$locale!!}[description]')">
                     </span>
                 </div>
 
diff --git a/packages/Webkul/Velocity/src/Resources/views/shop/checkout/onepage/customer-info.blade.php b/packages/Webkul/Velocity/src/Resources/views/shop/checkout/onepage/customer-info.blade.php
index 5d1790cda..9778ec5b0 100644
--- a/packages/Webkul/Velocity/src/Resources/views/shop/checkout/onepage/customer-info.blade.php
+++ b/packages/Webkul/Velocity/src/Resources/views/shop/checkout/onepage/customer-info.blade.php
@@ -72,8 +72,8 @@
                 <div :class="`col-12 mt15 has-error ${errors.has('address-form.billing[address_id]') ? 'has-error' : ''}`">
                     <span
                         class="control-error"
-                        v-if="errors.has('address-form.billing[address_id]')">
-                        @{{ errors.first('address-form.billing[address_id]') }}
+                        v-if="errors.has('address-form.billing[address_id]')"
+                        v-text="errors.first('address-form.billing[address_id]')">
                     </span>
                 </div>
 
@@ -198,9 +198,7 @@
                     </div>
 
                     <div :class="`col-12 mt15 has-error pl0 ${errors.has('address-form.shipping[address_id]') ? 'has-error' : ''}`">
-                        <span class="control-error" v-if="errors.has('address-form.shipping[address_id]')">
-                            @{{ errors.first('address-form.shipping[address_id]') }}
-                        </span>
+                        <span class="control-error" v-if="errors.has('address-form.shipping[address_id]')" v-text="errors.first('address-form.shipping[address_id]')"></span>
                     </div>
                 </div>
             </accordian>
diff --git a/packages/Webkul/Velocity/src/Resources/views/shop/checkout/onepage/customer-new-form.blade.php b/packages/Webkul/Velocity/src/Resources/views/shop/checkout/onepage/customer-new-form.blade.php
index 92732accc..7e2557adb 100644
--- a/packages/Webkul/Velocity/src/Resources/views/shop/checkout/onepage/customer-new-form.blade.php
+++ b/packages/Webkul/Velocity/src/Resources/views/shop/checkout/onepage/customer-new-form.blade.php
@@ -18,9 +18,7 @@
                 @change="validateForm('address-form')"
                 data-vv-as="&quot;{{ __('shop::app.checkout.onepage.first-name') }}&quot;" />
 
-            <span class="control-error" v-if="errors.has('address-form.shipping[first_name]')">
-                @{{ errors.first('address-form.shipping[first_name]') }}
-            </span>
+            <span class="control-error" v-if="errors.has('address-form.shipping[first_name]')" v-text="errors.first('address-form.shipping[first_name]')"></span>
         </div>
 
         <div :class="`col-12 form-field ${errors.has('address-form.shipping[last_name]') ? 'has-error' : ''}`">
@@ -38,9 +36,7 @@
                 @change="validateForm('address-form')"
                 data-vv-as="&quot;{{ __('shop::app.checkout.onepage.last-name') }}&quot;" />
 
-            <span class="control-error" v-if="errors.has('address-form.shipping[last_name]')">
-                @{{ errors.first('address-form.shipping[last_name]') }}
-            </span>
+            <span class="control-error" v-if="errors.has('address-form.shipping[last_name]')" v-text="errors.first('address-form.shipping[last_name]')"></span>
         </div>
 
         <div :class="`col-12 form-field ${errors.has('address-form.shipping[email]') ? 'has-error' : ''}`">
@@ -58,9 +54,7 @@
                 @change="validateForm('address-form')"
                 data-vv-as="&quot;{{ __('shop::app.checkout.onepage.email') }}&quot;" />
 
-            <span class="control-error" v-if="errors.has('address-form.shipping[email]')">
-                @{{ errors.first('address-form.shipping[email]') }}
-            </span>
+            <span class="control-error" v-if="errors.has('address-form.shipping[email]')" v-text="errors.first('address-form.shipping[email]')"></span>
         </div>
 
         <div :class="`col-12 form-field ${errors.has('address-form.shipping[address1][]') ? 'has-error' : ''}`" style="margin-bottom: 0;">
@@ -78,9 +72,7 @@
                 @change="validateForm('address-form')"
                 data-vv-as="&quot;{{ __('shop::app.checkout.onepage.address1') }}&quot;" />
 
-            <span class="control-error" v-if="errors.has('address-form.shipping[address1][]')">
-                @{{ errors.first('address-form.shipping[address1][]') }}
-            </span>
+            <span class="control-error" v-if="errors.has('address-form.shipping[address1][]')" v-text="errors.first('address-form.shipping[address1][]')"></span>
         </div>
 
         @if (
@@ -115,9 +107,7 @@
                 @change="validateForm('address-form')"
                 data-vv-as="&quot;{{ __('shop::app.checkout.onepage.city') }}&quot;" />
 
-            <span class="control-error" v-if="errors.has('address-form.shipping[city]')">
-                @{{ errors.first('address-form.shipping[city]') }}
-            </span>
+            <span class="control-error" v-if="errors.has('address-form.shipping[city]')" v-text="errors.first('address-form.shipping[city]')"></span>
         </div>
 
         <div :class="`col-12 form-field ${errors.has('address-form.shipping[country]') ? 'has-error' : ''}`">
@@ -146,9 +136,7 @@
                 <i class="select-icon rango-arrow-down"></i>
             </div>
 
-            <span class="control-error" v-if="errors.has('address-form.shipping[country]')">
-                @{{ errors.first('address-form.shipping[country]') }}
-            </span>
+            <span class="control-error" v-if="errors.has('address-form.shipping[country]')" v-text="errors.first('address-form.shipping[country]')"></span>
         </div>
 
 
@@ -189,9 +177,7 @@
                 <i class="select-icon rango-arrow-down"></i>
             </div>
 
-            <span class="control-error" v-if="errors.has('address-form.shipping[state]')">
-                @{{ errors.first('address-form.shipping[state]') }}
-            </span>
+            <span class="control-error" v-if="errors.has('address-form.shipping[state]')" v-text="errors.first('address-form.shipping[state]')"></span>
         </div>
 
         <div :class="`col-12 form-field ${errors.has('address-form.shipping[postcode]') ? 'has-error' : ''}`">
@@ -209,9 +195,7 @@
                 @keyup="validateForm('address-form')"
                 data-vv-as="&quot;{{ __('shop::app.checkout.onepage.postcode') }}&quot;" />
 
-            <span class="control-error" v-if="errors.has('address-form.shipping[postcode]')">
-                @{{ errors.first('address-form.shipping[postcode]') }}
-            </span>
+            <span class="control-error" v-if="errors.has('address-form.shipping[postcode]')" v-text="errors.first('address-form.shipping[postcode]')"></span>
         </div>
 
         <div :class="`col-12 form-field ${errors.has('address-form.shipping[phone]') ? 'has-error' : ''}`">
@@ -229,9 +213,7 @@
                 @change="validateForm('address-form')"
                 data-vv-as="&quot;{{ __('shop::app.checkout.onepage.phone') }}&quot;" />
 
-            <span class="control-error" v-if="errors.has('address-form.shipping[phone]')">
-                @{{ errors.first('address-form.shipping[phone]') }}
-            </span>
+            <span class="control-error" v-if="errors.has('address-form.shipping[phone]')" v-text="errors.first('address-form.shipping[phone]')"></span>
         </div>
 
         @auth('customer')
@@ -266,9 +248,7 @@
                 @change="validateForm('address-form')"
                 data-vv-as="&quot;{{ __('shop::app.checkout.onepage.company-name') }}&quot;" />
 
-            <span class="control-error" v-if="errors.has('address-form.billing[company_name]')">
-                @{{ errors.first('address-form.billing[company_name]') }}
-            </span>
+            <span class="control-error" v-if="errors.has('address-form.billing[company_name]')" v-text="errors.first('address-form.billing[company_name]')"></span>
         </div>
 
         <div :class="`col-12 form-field ${errors.has('address-form.billing[first_name]') ? 'has-error' : ''}`">
@@ -286,9 +266,7 @@
                 @change="validateForm('address-form')"
                 data-vv-as="&quot;{{ __('shop::app.checkout.onepage.first-name') }}&quot;" />
 
-            <span class="control-error" v-if="errors.has('address-form.billing[first_name]')">
-                @{{ errors.first('address-form.billing[first_name]') }}
-            </span>
+            <span class="control-error" v-if="errors.has('address-form.billing[first_name]')" v-text="errors.first('address-form.billing[first_name]')"></span>
         </div>
 
         <div :class="`col-12 form-field ${errors.has('address-form.billing[last_name]') ? 'has-error' : ''}`">
@@ -306,9 +284,7 @@
                 @change="validateForm('address-form')"
                 data-vv-as="&quot;{{ __('shop::app.checkout.onepage.last-name') }}&quot;" />
 
-            <span class="control-error" v-if="errors.has('address-form.billing[last_name]')">
-                @{{ errors.first('address-form.billing[last_name]') }}
-            </span>
+            <span class="control-error" v-if="errors.has('address-form.billing[last_name]')" v-text="errors.first('address-form.billing[last_name]')"></span>
         </div>
 
         <div :class="`col-12 form-field ${errors.has('address-form.billing[email]') ? 'has-error' : ''}`">
@@ -327,9 +303,7 @@
                 @change="validateForm('address-form')"
                 data-vv-as="&quot;{{ __('shop::app.checkout.onepage.email') }}&quot;" />
 
-            <span class="control-error" v-if="errors.has('address-form.billing[email]')">
-                @{{ errors.first('address-form.billing[email]') }}
-            </span>
+            <span class="control-error" v-if="errors.has('address-form.billing[email]')" v-text="errors.first('address-form.billing[email]')"></span>
         </div>
 
         {{--  for customer login checkout   --}}
@@ -352,9 +326,7 @@
                 @change="validateForm('address-form')"
                 data-vv-as="&quot;{{ __('shop::app.checkout.onepage.address1') }}&quot;" />
 
-            <span class="control-error" v-if="errors.has('address-form.billing[address1][]')">
-                @{{ errors.first('address-form.billing[address1][]') }}
-            </span>
+            <span class="control-error" v-if="errors.has('address-form.billing[address1][]')" v-text="errors.first('address-form.billing[address1][]')"></span>
         </div>
 
         @if (
@@ -388,9 +360,7 @@
                 @change="validateForm('address-form')"
                 data-vv-as="&quot;{{ __('shop::app.checkout.onepage.city') }}&quot;" />
 
-            <span class="control-error" v-if="errors.has('address-form.billing[city]')">
-                @{{ errors.first('address-form.billing[city]') }}
-            </span>
+            <span class="control-error" v-if="errors.has('address-form.billing[city]')" v-text="errors.first('address-form.billing[city]')"></span>
         </div>
 
         <div :class="`col-12 form-field ${errors.has('address-form.billing[country]') ? 'has-error' : ''}`">
@@ -419,9 +389,7 @@
                 <i class="select-icon rango-arrow-down"></i>
             </div>
 
-            <span class="control-error" v-if="errors.has('address-form.billing[country]')">
-                @{{ errors.first('address-form.billing[country]') }}
-            </span>
+            <span class="control-error" v-if="errors.has('address-form.billing[country]')" v-text="errors.first('address-form.billing[country]')"></span>
         </div>
 
         <div :class="`col-12 form-field ${errors.has('address-form.billing[state]') ? 'has-error' : ''}`">
@@ -460,9 +428,7 @@
                 <i class="select-icon rango-arrow-down"></i>
             </div>
 
-            <span class="control-error" v-if="errors.has('address-form.billing[state]')">
-                @{{ errors.first('address-form.billing[state]') }}
-            </span>
+            <span class="control-error" v-if="errors.has('address-form.billing[state]')" v-text="errors.first('address-form.billing[state]')"></span>
         </div>
 
         <div :class="`col-12 form-field ${errors.has('address-form.billing[postcode]') ? 'has-error' : ''}`">
@@ -480,9 +446,7 @@
                 @change="validateForm('address-form')"
                 data-vv-as="&quot;{{ __('shop::app.checkout.onepage.postcode') }}&quot;" />
 
-            <span class="control-error" v-if="errors.has('address-form.billing[postcode]')">
-                @{{ errors.first('address-form.billing[postcode]') }}
-            </span>
+            <span class="control-error" v-if="errors.has('address-form.billing[postcode]')" v-text="errors.first('address-form.billing[postcode]')"></span>
         </div>
 
         <div :class="`col-12 form-field ${errors.has('address-form.billing[phone]') ? 'has-error' : ''}`">
@@ -500,9 +464,7 @@
                 @change="validateForm('address-form')"
                 data-vv-as="&quot;{{ __('shop::app.checkout.onepage.phone') }}&quot;" />
 
-            <span class="control-error" v-if="errors.has('address-form.billing[phone]')">
-                @{{ errors.first('address-form.billing[phone]') }}
-            </span>
+            <span class="control-error" v-if="errors.has('address-form.billing[phone]')" v-text="errors.first('address-form.billing[phone]')"></span>
         </div>
 
         @if ($cart->haveStockableItems())
diff --git a/packages/Webkul/Velocity/src/Resources/views/shop/checkout/onepage/payment.blade.php b/packages/Webkul/Velocity/src/Resources/views/shop/checkout/onepage/payment.blade.php
index be0f4af35..ff12426e6 100644
--- a/packages/Webkul/Velocity/src/Resources/views/shop/checkout/onepage/payment.blade.php
+++ b/packages/Webkul/Velocity/src/Resources/views/shop/checkout/onepage/payment.blade.php
@@ -2,7 +2,7 @@
     <div class="form-container">
         <accordian :title="'{{ __('shop::app.checkout.payment-methods') }}'" :active="true">
             <div class="form-header mb-30" slot="header">
-                
+
                 <h3 class="fw6 display-inbl">
                    {{ __('shop::app.checkout.onepage.payment-methods') }}
                 </h3>
@@ -58,9 +58,7 @@
 
                 @endforeach
 
-                <span class="control-error" v-if="errors.has('payment-form.payment[method]')">
-                    @{{ errors.first('payment-form.payment[method]') }}
-                </span>
+                <span class="control-error" v-if="errors.has('payment-form.payment[method]')" v-text="errors.first('payment-form.payment[method]')"></span>
             </div>
         </accordian>
     </div>
diff --git a/packages/Webkul/Velocity/src/Resources/views/shop/checkout/onepage/shipping.blade.php b/packages/Webkul/Velocity/src/Resources/views/shop/checkout/onepage/shipping.blade.php
index 044e8bd91..5b59cae80 100644
--- a/packages/Webkul/Velocity/src/Resources/views/shop/checkout/onepage/shipping.blade.php
+++ b/packages/Webkul/Velocity/src/Resources/views/shop/checkout/onepage/shipping.blade.php
@@ -50,9 +50,8 @@
 
                 <span
                     class="control-error"
-                    v-if="errors.has('shipping-form.shipping_method')">
-
-                    @{{ errors.first('shipping-form.shipping_method') }}
+                    v-if="errors.has('shipping-form.shipping_method')"
+                    v-text="errors.first('shipping-form.shipping_method')">
                 </span>
             </div>
         </accordian>
diff --git a/packages/Webkul/Velocity/src/Resources/views/shop/customers/account/address/country-state.blade.php b/packages/Webkul/Velocity/src/Resources/views/shop/customers/account/address/country-state.blade.php
index 6776aa123..30abdecb7 100644
--- a/packages/Webkul/Velocity/src/Resources/views/shop/customers/account/address/country-state.blade.php
+++ b/packages/Webkul/Velocity/src/Resources/views/shop/customers/account/address/country-state.blade.php
@@ -20,9 +20,7 @@
                     <span class="select-icon rango-arrow-down"></span>
                 </div>
 
-                <span class="control-error" v-if="errors.has('country')">
-                    @{{ errors.first('country') }}
-                </span>
+                <span class="control-error" v-if="errors.has('country')" v-text="errors.first('country')"></span>
             </div>
 
             <div class="control-group" :class="[errors.has('state') ? 'has-error' : '']">
@@ -61,9 +59,7 @@
                     </div>
                 </template>
 
-                <span class="control-error" v-if="errors.has('state')">
-                    @{{ errors.first('state') }}
-                </span>
+                <span class="control-error" v-if="errors.has('state')" v-text="errors.first('state')"></span>
             </div>
         </div>
     </script>
diff --git a/packages/Webkul/Velocity/src/Resources/views/shop/customers/account/address/create.blade.php b/packages/Webkul/Velocity/src/Resources/views/shop/customers/account/address/create.blade.php
index cd0273003..5d6ead2da 100644
--- a/packages/Webkul/Velocity/src/Resources/views/shop/customers/account/address/create.blade.php
+++ b/packages/Webkul/Velocity/src/Resources/views/shop/customers/account/address/create.blade.php
@@ -23,7 +23,7 @@
                 <div class="control-group" :class="[errors.has('company_name') ? 'has-error' : '']">
                     <label for="company_name">{{ __('shop::app.customer.account.address.create.company_name') }}</label>
                     <input type="text" class="control" name="company_name" value="{{ old('company_name') }}" data-vv-as="&quot;{{ __('shop::app.customer.account.address.create.company_name') }}&quot;">
-                    <span class="control-error" v-if="errors.has('company_name')">@{{ errors.first('company_name') }}</span>
+                    <span class="control-error" v-if="errors.has('company_name')" v-text="errors.first('company_name')"></span>
                 </div>
 
                 {!! view_render_event('bagisto.shop.customers.account.address.create_form_controls.company_name.after') !!}
@@ -31,7 +31,7 @@
                 <div class="control-group" :class="[errors.has('first_name') ? 'has-error' : '']">
                     <label for="first_name" class="mandatory">{{ __('shop::app.customer.account.address.create.first_name') }}</label>
                     <input type="text" class="control" name="first_name" value="{{ old('first_name') }}" v-validate="'required'" data-vv-as="&quot;{{ __('shop::app.customer.account.address.create.first_name') }}&quot;">
-                    <span class="control-error" v-if="errors.has('first_name')">@{{ errors.first('first_name') }}</span>
+                    <span class="control-error" v-if="errors.has('first_name')" v-text="errors.first('first_name')"></span>
                 </div>
 
                 {!! view_render_event('bagisto.shop.customers.account.address.create_form_controls.first_name.after') !!}
@@ -39,7 +39,7 @@
                 <div class="control-group" :class="[errors.has('last_name') ? 'has-error' : '']">
                     <label for="last_name" class="mandatory">{{ __('shop::app.customer.account.address.create.last_name') }}</label>
                     <input type="text" class="control" name="last_name" value="{{ old('last_name') }}" v-validate="'required'" data-vv-as="&quot;{{ __('shop::app.customer.account.address.create.last_name') }}&quot;">
-                    <span class="control-error" v-if="errors.has('last_name')">@{{ errors.first('last_name') }}</span>
+                    <span class="control-error" v-if="errors.has('last_name')" v-text="errors.first('last_name')"></span>
                 </div>
 
                 {!! view_render_event('bagisto.shop.customers.account.address.create_form_controls.last_name.after') !!}
@@ -49,7 +49,7 @@
                         <span class="help-note">{{ __('shop::app.customer.account.address.create.vat_help_note') }}</span>
                     </label>
                     <input type="text" class="control" name="vat_id" value="{{ old('vat_id') }}" v-validate="" data-vv-as="&quot;{{ __('shop::app.customer.account.address.create.vat_id') }}&quot;">
-                    <span class="control-error" v-if="errors.has('vat_id')">@{{ errors.first('vat_id') }}</span>
+                    <span class="control-error" v-if="errors.has('vat_id')" v-text="errors.first('vat_id')"></span>
                 </div>
 
                 {!! view_render_event('bagisto.shop.customers.account.address.create_form_controls.vat_id.after') !!}
@@ -61,7 +61,7 @@
                 <div class="control-group" :class="[errors.has('address1[]') ? 'has-error' : '']">
                     <label for="address_0" class="mandatory">{{ __('shop::app.customer.account.address.create.street-address') }}</label>
                     <input type="text" class="control" name="address1[]" id="address_0" value="{{ $addresses[0] ?: '' }}" v-validate="'required'" data-vv-as="&quot;{{ __('shop::app.customer.account.address.create.street-address') }}&quot;">
-                    <span class="control-error" v-if="errors.has('address1[]')">@{{ errors.first('address1[]') }}</span>
+                    <span class="control-error" v-if="errors.has('address1[]')" v-text="errors.first('address1[]')"></span>
                 </div>
 
                 @if (core()->getConfigData('customer.settings.address.street_lines') && core()->getConfigData('customer.settings.address.street_lines') > 1)
@@ -81,7 +81,7 @@
                 <div class="control-group" :class="[errors.has('city') ? 'has-error' : '']">
                     <label for="city" class="mandatory">{{ __('shop::app.customer.account.address.create.city') }}</label>
                     <input type="text" class="control" name="city" value="{{ old('city') }}" v-validate="'required'" data-vv-as="&quot;{{ __('shop::app.customer.account.address.create.city') }}&quot;">
-                    <span class="control-error" v-if="errors.has('city')">@{{ errors.first('city') }}</span>
+                    <span class="control-error" v-if="errors.has('city')" v-text="errors.first('city')"></span>
                 </div>
 
                 {!! view_render_event('bagisto.shop.customers.account.address.create_form_controls.city.after') !!}
@@ -89,7 +89,7 @@
                 <div class="control-group" :class="[errors.has('postcode') ? 'has-error' : '']">
                     <label for="postcode" class="mandatory">{{ __('shop::app.customer.account.address.create.postcode') }}</label>
                     <input type="text" class="control" name="postcode" value="{{ old('postcode') }}" v-validate="'required'" data-vv-as="&quot;{{ __('shop::app.customer.account.address.create.postcode') }}&quot;">
-                    <span class="control-error" v-if="errors.has('postcode')">@{{ errors.first('postcode') }}</span>
+                    <span class="control-error" v-if="errors.has('postcode')" v-text="errors.first('postcode')"></span>
                 </div>
 
                 {!! view_render_event('bagisto.shop.customers.account.address.create_form_controls.postcode.after') !!}
@@ -97,7 +97,7 @@
                 <div class="control-group" :class="[errors.has('phone') ? 'has-error' : '']">
                     <label for="phone" class="mandatory">{{ __('shop::app.customer.account.address.create.phone') }}</label>
                     <input type="text" class="control" name="phone" value="{{ old('phone') }}" v-validate="'required'" data-vv-as="&quot;{{ __('shop::app.customer.account.address.create.phone') }}&quot;">
-                    <span class="control-error" v-if="errors.has('phone')">@{{ errors.first('phone') }}</span>
+                    <span class="control-error" v-if="errors.has('phone')" v-text="errors.first('phone')"></span>
                 </div>
 
                 {!! view_render_event('bagisto.shop.customers.account.address.create_form_controls.after') !!}
diff --git a/packages/Webkul/Velocity/src/Resources/views/shop/customers/account/address/edit.blade.php b/packages/Webkul/Velocity/src/Resources/views/shop/customers/account/address/edit.blade.php
index 225ea3cb4..b3d8f173e 100644
--- a/packages/Webkul/Velocity/src/Resources/views/shop/customers/account/address/edit.blade.php
+++ b/packages/Webkul/Velocity/src/Resources/views/shop/customers/account/address/edit.blade.php
@@ -26,7 +26,7 @@
             <div class="control-group" :class="[errors.has('company_name') ? 'has-error' : '']">
                 <label for="company_name">{{ __('shop::app.customer.account.address.edit.company_name') }}</label>
                 <input type="text"  class="control" name="company_name" value="{{ old('company_name') ?? $address->company_name }}" data-vv-as="&quot;{{ __('shop::app.customer.account.address.edit.company_name') }}&quot;">
-                <span class="control-error" v-if="errors.has('company_name')">@{{ errors.first('company_name') }}</span>
+                <span class="control-error" v-if="errors.has('company_name')" v-text="errors.first('company_name')"></span>
             </div>
 
             {!! view_render_event('bagisto.shop.customers.account.address.edit_form_controls.company_name.after') !!}
@@ -34,7 +34,7 @@
             <div class="control-group" :class="[errors.has('first_name') ? 'has-error' : '']">
                 <label for="first_name" class="mandatory">{{ __('shop::app.customer.account.address.create.first_name') }}</label>
                 <input type="text" class="control" name="first_name" value="{{ old('first_name') ?? $address->first_name }}" v-validate="'required'" data-vv-as="&quot;{{ __('shop::app.customer.account.address.create.first_name') }}&quot;">
-                <span class="control-error" v-if="errors.has('first_name')">@{{ errors.first('first_name') }}</span>
+                <span class="control-error" v-if="errors.has('first_name')" v-text="errors.first('first_name')"></span>
             </div>
 
             {!! view_render_event('bagisto.shop.customers.account.address.edit_form_controls.first_name.after') !!}
@@ -42,7 +42,7 @@
             <div class="control-group" :class="[errors.has('last_name') ? 'has-error' : '']">
                 <label for="last_name" class="mandatory">{{ __('shop::app.customer.account.address.create.last_name') }}</label>
                 <input type="text" class="control" name="last_name" value="{{ old('last_name') ?? $address->last_name }}" v-validate="'required'" data-vv-as="&quot;{{ __('shop::app.customer.account.address.create.last_name') }}&quot;">
-                <span class="control-error" v-if="errors.has('last_name')">@{{ errors.first('last_name') }}</span>
+                <span class="control-error" v-if="errors.has('last_name')" v-text="errors.first('last_name')"></span>
             </div>
 
             {!! view_render_event('bagisto.shop.customers.account.address.edit_form_controls.last_name.after') !!}
@@ -52,7 +52,7 @@
                     <span class="help-note">{{ __('shop::app.customer.account.address.create.vat_help_note') }}</span>
                 </label>
                 <input type="text" class="control" name="vat_id" value="{{ old('vat_id') ?? $address->vat_id }}" v-validate="" data-vv-as="&quot;{{ __('shop::app.customer.account.address.create.vat_id') }}&quot;">
-                <span class="control-error" v-if="errors.has('vat_id')">@{{ errors.first('vat_id') }}</span>
+                <span class="control-error" v-if="errors.has('vat_id')" v-text="errors.first('vat_id')"></span>
             </div>
 
             {!! view_render_event('bagisto.shop.customers.account.address.edit_form_controls.vat_id.after') !!}
@@ -60,7 +60,7 @@
             <div class="control-group" :class="[errors.has('address1[]') ? 'has-error' : '']">
                 <label for="address_0" class="mandatory">{{ __('shop::app.customer.account.address.edit.street-address') }}</label>
                 <input type="text" class="control" name="address1[]" value="{{ isset($addresses[0]) ? $addresses[0] : '' }}" id="address_0" v-validate="'required'" data-vv-as="&quot;{{ __('shop::app.customer.account.address.create.street-address') }}&quot;">
-                <span class="control-error" v-if="errors.has('address1[]')">@{{ errors.first('address1[]') }}</span>
+                <span class="control-error" v-if="errors.has('address1[]')" v-text="errors.first('address1[]')"></span>
             </div>
 
             @if (core()->getConfigData('customer.settings.address.street_lines') && core()->getConfigData('customer.settings.address.street_lines') > 1)
@@ -80,7 +80,7 @@
             <div class="control-group" :class="[errors.has('city') ? 'has-error' : '']">
                 <label for="city" class="mandatory">{{ __('shop::app.customer.account.address.create.city') }}</label>
                 <input type="text" class="control" name="city" value="{{ old('city') ?? $address->city }}" v-validate="'required|regex:^[a-zA-Z \-]*$'" data-vv-as="&quot;{{ __('shop::app.customer.account.address.create.city') }}&quot;">
-                <span class="control-error" v-if="errors.has('city')">@{{ errors.first('city') }}</span>
+                <span class="control-error" v-if="errors.has('city')" v-text="errors.first('city')"></span>
             </div>
 
             {!! view_render_event('bagisto.shop.customers.account.address.edit_form_controls.create.after') !!}
@@ -88,7 +88,7 @@
             <div class="control-group" :class="[errors.has('postcode') ? 'has-error' : '']">
                 <label for="postcode" class="mandatory">{{ __('shop::app.customer.account.address.create.postcode') }}</label>
                 <input type="text" class="control" name="postcode" value="{{ old('postcode') ?? $address->postcode }}" v-validate="'required'" data-vv-as="&quot;{{ __('shop::app.customer.account.address.create.postcode') }}&quot;">
-                <span class="control-error" v-if="errors.has('postcode')">@{{ errors.first('postcode') }}</span>
+                <span class="control-error" v-if="errors.has('postcode')" v-text="errors.first('postcode')"></span>
             </div>
 
             {!! view_render_event('bagisto.shop.customers.account.address.edit_form_controls.postcode.after') !!}
@@ -96,7 +96,7 @@
             <div class="control-group" :class="[errors.has('phone') ? 'has-error' : '']">
                 <label for="phone" class="mandatory">{{ __('shop::app.customer.account.address.create.phone') }}</label>
                 <input type="text" class="control" name="phone" value="{{ old('phone') ?? $address->phone }}" v-validate="'required'" data-vv-as="&quot;{{ __('shop::app.customer.account.address.create.phone') }}&quot;">
-                <span class="control-error" v-if="errors.has('phone')">@{{ errors.first('phone') }}</span>
+                <span class="control-error" v-if="errors.has('phone')" v-text="errors.first('phone')"></span>
             </div>
 
             {!! view_render_event('bagisto.shop.customers.account.address.edit_form_controls.after', ['address' => $address]) !!}
diff --git a/packages/Webkul/Velocity/src/Resources/views/shop/customers/account/profile/edit.blade.php b/packages/Webkul/Velocity/src/Resources/views/shop/customers/account/profile/edit.blade.php
index 14c70dd45..39039f6f3 100644
--- a/packages/Webkul/Velocity/src/Resources/views/shop/customers/account/profile/edit.blade.php
+++ b/packages/Webkul/Velocity/src/Resources/views/shop/customers/account/profile/edit.blade.php
@@ -30,7 +30,7 @@
 
                 <div class="col-12">
                     <input value="{{ $customer->first_name }}" name="first_name" type="text" v-validate="'required'" />
-                    <span class="control-error" v-if="errors.has('first_name')">@{{ errors.first('first_name') }}</span>
+                    <span class="control-error" v-if="errors.has('first_name')" v-text="errors.first('first_name')"></span>
                 </div>
             </div>
 
@@ -90,7 +90,7 @@
                         <span class="select-icon rango-arrow-down"></span>
                     </div>
 
-                    <span class="control-error" v-if="errors.has('gender')">@{{ errors.first('gender') }}</span>
+                    <span class="control-error" v-if="errors.has('gender')" v-text="errors.first('gender')"></span>
                 </div>
             </div>
 
@@ -109,9 +109,7 @@
                         value="{{ old('date_of_birth') ?? $customer->date_of_birth }}"
                         v-validate="" data-vv-as="&quot;{{ __('shop::app.customer.account.profile.dob') }}&quot;" />
 
-                        <span class="control-error" v-if="errors.has('date_of_birth')">
-                            @{{ errors.first('date_of_birth') }}
-                        </span>
+                        <span class="control-error" v-if="errors.has('date_of_birth')" v-text="errors.first('date_of_birth')"></span>
                 </div>
             </div>
 
@@ -124,7 +122,7 @@
 
                 <div class="col-12">
                     <input value="{{ $customer->email }}" name="email" type="text" v-validate="'required'" />
-                    <span class="control-error" v-if="errors.has('email')">@{{ errors.first('email') }}</span>
+                    <span class="control-error" v-if="errors.has('email')" v-text="errors.first('email')"></span>
                 </div>
             </div>
 
@@ -137,7 +135,7 @@
 
                 <div class="col-12">
                     <input value="{{ old('phone') ?? $customer->phone }}" name="phone" type="text"/>
-                    <span class="control-error" v-if="errors.has('phone')">@{{ errors.first('phone') }}</span>
+                    <span class="control-error" v-if="errors.has('phone')" v-text="errors.first('phone')"></span>
                 </div>
             </div>
 
@@ -168,9 +166,7 @@
                         type="password"
                         v-validate="'min:6|max:18'" />
 
-                    <span class="control-error" v-if="errors.has('password')">
-                        @{{ errors.first('password') }}
-                    </span>
+                    <span class="control-error" v-if="errors.has('password')" v-text="errors.first('password')"></span>
                 </div>
             </div>
 
@@ -185,9 +181,7 @@
                     <input value="" name="password_confirmation" type="password"
                     v-validate="'min:6|confirmed:password'" data-vv-as="confirm password" />
 
-                    <span class="control-error" v-if="errors.has('password_confirmation')">
-                        @{{ errors.first('password_confirmation') }}
-                    </span>
+                    <span class="control-error" v-if="errors.has('password_confirmation')" v-text="errors.first('password_confirmation')"></span>
                 </div>
             </div>
 
diff --git a/packages/Webkul/Velocity/src/Resources/views/shop/customers/account/profile/index.blade.php b/packages/Webkul/Velocity/src/Resources/views/shop/customers/account/profile/index.blade.php
index 10d9a2c1b..454402805 100644
--- a/packages/Webkul/Velocity/src/Resources/views/shop/customers/account/profile/index.blade.php
+++ b/packages/Webkul/Velocity/src/Resources/views/shop/customers/account/profile/index.blade.php
@@ -99,7 +99,7 @@
                     <div class="control-group" :class="[errors.has('password') ? 'has-error' : '']">
                         <label for="password" class="required">{{ __('admin::app.users.users.password') }}</label>
                         <input type="password" v-validate="'required|min:6|max:18'" class="control" id="password" name="password" data-vv-as="&quot;{{ __('admin::app.users.users.password') }}&quot;"/>
-                        <span class="control-error" v-if="errors.has('password')">@{{ errors.first('password') }}</span>
+                        <span class="control-error" v-if="errors.has('password')" v-text="errors.first('password')"></span>
                     </div>
 
                     <div class="page-action">
diff --git a/packages/Webkul/Velocity/src/Resources/views/shop/customers/session/index.blade.php b/packages/Webkul/Velocity/src/Resources/views/shop/customers/session/index.blade.php
index 4c15d8ee7..f8b18e60f 100644
--- a/packages/Webkul/Velocity/src/Resources/views/shop/customers/session/index.blade.php
+++ b/packages/Webkul/Velocity/src/Resources/views/shop/customers/session/index.blade.php
@@ -56,9 +56,7 @@
                                     value="{{ old('email') }}"
                                     data-vv-as="&quot;{{ __('shop::app.customer.login-form.email') }}&quot;" />
 
-                                <span class="control-error" v-if="errors.has('email')">
-                                    @{{ errors.first('email') }}
-                                </span>
+                                <span class="control-error" v-if="errors.has('email')" v-text="errors.first('email')"></span>
                             </div>
 
                             <div class="form-group" :class="[errors.has('password') ? 'has-error' : '']">
@@ -74,9 +72,7 @@
                                     value="{{ old('password') }}"
                                     data-vv-as="&quot;{{ __('shop::app.customer.login-form.password') }}&quot;" />
 
-                                <span class="control-error" v-if="errors.has('password')">
-                                    @{{ errors.first('password') }}
-                                </span>
+                                <span class="control-error" v-if="errors.has('password')" v-text="errors.first('password')"></span>
 
                                 <a href="{{ route('customer.forgot-password.create') }}" class="float-right">
                                     {{ __('shop::app.customer.login-form.forgot_pass') }}
diff --git a/packages/Webkul/Velocity/src/Resources/views/shop/customers/signup/forgot-password.blade.php b/packages/Webkul/Velocity/src/Resources/views/shop/customers/signup/forgot-password.blade.php
index 3bb1c2ced..8d0402b28 100644
--- a/packages/Webkul/Velocity/src/Resources/views/shop/customers/signup/forgot-password.blade.php
+++ b/packages/Webkul/Velocity/src/Resources/views/shop/customers/signup/forgot-password.blade.php
@@ -51,9 +51,7 @@
                                 class="form-style"
                                 v-validate="'required|email'" />
 
-                            <span class="control-error" v-if="errors.has('email')">
-                                @{{ errors.first('email') }}
-                            </span>
+                            <span class="control-error" v-if="errors.has('email')" v-text="errors.first('email')"></span>
                         </div>
 
                         <div class="control-group">
diff --git a/packages/Webkul/Velocity/src/Resources/views/shop/customers/signup/index.blade.php b/packages/Webkul/Velocity/src/Resources/views/shop/customers/signup/index.blade.php
index 94c0480c7..f7638273b 100644
--- a/packages/Webkul/Velocity/src/Resources/views/shop/customers/signup/index.blade.php
+++ b/packages/Webkul/Velocity/src/Resources/views/shop/customers/signup/index.blade.php
@@ -53,9 +53,7 @@
                                 value="{{ old('first_name') }}"
                                 data-vv-as="&quot;{{ __('shop::app.customer.signup-form.firstname') }}&quot;" />
 
-                            <span class="control-error" v-if="errors.has('first_name')">
-                                @{{ errors.first('first_name') }}
-                            </span>
+                            <span class="control-error" v-if="errors.has('first_name')" v-text="errors.first('first_name')"></span>
                         </div>
 
                         {!! view_render_event('bagisto.shop.customers.signup_form_controls.firstname.after') !!}
@@ -73,9 +71,7 @@
                                 value="{{ old('last_name') }}"
                                 data-vv-as="&quot;{{ __('shop::app.customer.signup-form.lastname') }}&quot;" />
 
-                            <span class="control-error" v-if="errors.has('last_name')">
-                                @{{ errors.first('last_name') }}
-                            </span>
+                            <span class="control-error" v-if="errors.has('last_name')" v-text="errors.first('last_name')"></span>
                         </div>
 
                         {!! view_render_event('bagisto.shop.customers.signup_form_controls.lastname.after') !!}
@@ -93,9 +89,7 @@
                                 value="{{ old('email') }}"
                                 data-vv-as="&quot;{{ __('shop::app.customer.signup-form.email') }}&quot;" />
 
-                            <span class="control-error" v-if="errors.has('email')">
-                                @{{ errors.first('email') }}
-                            </span>
+                            <span class="control-error" v-if="errors.has('email')" v-text="errors.first('email')"></span>
                         </div>
 
                         {!! view_render_event('bagisto.shop.customers.signup_form_controls.email.after') !!}
@@ -114,9 +108,7 @@
                                 value="{{ old('password') }}"
                                 data-vv-as="&quot;{{ __('shop::app.customer.signup-form.password') }}&quot;" />
 
-                            <span class="control-error" v-if="errors.has('password')">
-                                @{{ errors.first('password') }}
-                            </span>
+                            <span class="control-error" v-if="errors.has('password')" v-text="errors.first('password')"></span>
                         </div>
 
                         {!! view_render_event('bagisto.shop.customers.signup_form_controls.password.after') !!}
@@ -133,9 +125,7 @@
                                 v-validate="'required|min:6|confirmed:password'"
                                 data-vv-as="&quot;{{ __('shop::app.customer.signup-form.confirm_pass') }}&quot;" />
 
-                            <span class="control-error" v-if="errors.has('password_confirmation')">
-                                @{{ errors.first('password_confirmation') }}
-                            </span>
+                            <span class="control-error" v-if="errors.has('password_confirmation')" v-text="errors.first('password_confirmation')"></span>
                         </div>
 
                         {!! view_render_event('bagisto.shop.customers.signup_form_controls.password_confirmation.after') !!}
diff --git a/packages/Webkul/Velocity/src/Resources/views/shop/customers/signup/reset-password.blade.php b/packages/Webkul/Velocity/src/Resources/views/shop/customers/signup/reset-password.blade.php
index 75754743b..4f541c5ea 100644
--- a/packages/Webkul/Velocity/src/Resources/views/shop/customers/signup/reset-password.blade.php
+++ b/packages/Webkul/Velocity/src/Resources/views/shop/customers/signup/reset-password.blade.php
@@ -45,9 +45,7 @@
                                     value="{{ old('email') }}"
                                     v-validate="'required|email'" />
 
-                                <span class="control-error" v-if="errors.has('email')">
-                                    @{{ errors.first('email') }}
-                                </span>
+                                <span class="control-error" v-if="errors.has('email')" v-text="errors.first('email')"></span>
                             </div>
 
                             <div :class="`form-group ${errors.has('password') ? 'has-error' : ''}`">
@@ -62,9 +60,7 @@
                                     type="password"
                                     v-validate="'required|min:6'" />
 
-                                <span class="control-error" v-if="errors.has('password')">
-                                    @{{ errors.first('password') }}
-                                </span>
+                                <span class="control-error" v-if="errors.has('password')" v-text="errors.first('password')"></span>
                             </div>
 
                             <div :class="`form-group ${errors.has('confirm_password') ? 'has-error' : ''}`">
@@ -78,9 +74,7 @@
                                     name="password_confirmation"
                                     v-validate="'required|min:6|confirmed:password'" />
 
-                                <span class="control-error" v-if="errors.has('password_confirmation')">
-                                    @{{ errors.first('password_confirmation') }}
-                                </span>
+                                <span class="control-error" v-if="errors.has('password_confirmation')" v-text="errors.first('password_confirmation')"></span>
                             </div>
 
                             {!! view_render_event('bagisto.shop.customers.forget_password_form_controls.after') !!}
diff --git a/packages/Webkul/Velocity/src/Resources/views/shop/products/reviews/create.blade.php b/packages/Webkul/Velocity/src/Resources/views/shop/products/reviews/create.blade.php
index 918728fbe..9d2432116 100644
--- a/packages/Webkul/Velocity/src/Resources/views/shop/products/reviews/create.blade.php
+++ b/packages/Webkul/Velocity/src/Resources/views/shop/products/reviews/create.blade.php
@@ -30,9 +30,7 @@
                                 {{ __('admin::app.customers.reviews.rating') }}
                             </label>
                             <star-ratings ratings="5" size="24" editable="true"></star-ratings>
-                            <span :class="`control-error ${errors.has('rating') ? '' : 'hide'}`" v-if="errors.has('rating')">
-                                @{{ errors.first('rating') }}
-                            </span>
+                            <span :class="`control-error ${errors.has('rating') ? '' : 'hide'}`" v-if="errors.has('rating')" v-text="errors.first('rating')"></span>
                         </div>
 
                         <div :class="`${errors.has('title') ? 'has-error' : ''}`">
@@ -46,9 +44,7 @@
                                 v-validate="'required'"
                                 value="{{ old('title') }}" />
 
-                            <span :class="`control-error ${errors.has('title') ? '' : 'hide'}`">
-                                @{{ errors.first('title') }}
-                            </span>
+                            <span :class="`control-error ${errors.has('title') ? '' : 'hide'}`" v-text="errors.first('title')"></span>
                         </div>
 
                         @if (core()->getConfigData('catalog.products.review.guest_review') && ! auth()->guard('customer')->user())
@@ -57,9 +53,7 @@
                                     {{ __('shop::app.reviews.name') }}
                                 </label>
                                 <input  type="text" class="control" name="name" v-validate="'required'" value="{{ old('name') }}">
-                                <span :class="`control-error ${errors.has('name') ? '' : 'hide'}`">
-                                    @{{ errors.first('name') }}
-                                </span>
+                                <span :class="`control-error ${errors.has('name') ? '' : 'hide'}`" v-text="errors.first('name')"></span>
                             </div>
                         @endif
 
@@ -74,9 +68,7 @@
                                 v-validate="'required'"
                                 value="{{ old('comment') }}">
                             </textarea>
-                            <span :class="`control-error ${errors.has('comment') ? '' : 'hide'}`">
-                                @{{ errors.first('comment') }}
-                            </span>
+                            <span :class="`control-error ${errors.has('comment') ? '' : 'hide'}`" v-text="errors.first('comment')"></span>
                         </div>
 
                         <div class="{!! $errors->has('images.*') ? 'has-error' : '' !!}">
diff --git a/packages/Webkul/Velocity/src/Resources/views/shop/products/view/bundle-options.blade.php b/packages/Webkul/Velocity/src/Resources/views/shop/products/view/bundle-options.blade.php
index 6e98429f8..f0c35f35e 100644
--- a/packages/Webkul/Velocity/src/Resources/views/shop/products/view/bundle-options.blade.php
+++ b/packages/Webkul/Velocity/src/Resources/views/shop/products/view/bundle-options.blade.php
@@ -122,9 +122,7 @@
                         </select>
                     </div>
 
-                    <span class="control-error" v-if="errors.has('bundle_options[' + option.id + '][]')">
-                        @{{ errors.first('bundle_options[' + option.id + '][]') }}
-                    </span>
+                    <span class="control-error" v-if="errors.has('bundle_options[' + option.id + '][]')" v-text="errors.first('bundle_options[' + option.id + '][]')"></span>
                 </div>
 
                 <div v-if="option.type == 'select' || option.type == 'radio'">
diff --git a/packages/Webkul/Velocity/src/Resources/views/shop/products/view/configurable-options.blade.php b/packages/Webkul/Velocity/src/Resources/views/shop/products/view/configurable-options.blade.php
index 6e5ce0c31..9212724c5 100644
--- a/packages/Webkul/Velocity/src/Resources/views/shop/products/view/configurable-options.blade.php
+++ b/packages/Webkul/Velocity/src/Resources/views/shop/products/view/configurable-options.blade.php
@@ -91,9 +91,7 @@
                         <span v-if="! attribute.options.length" class="no-options">{{ __('shop::app.products.select-above-options') }}</span>
                     </span>
 
-                    <span class="control-error" v-if="errors.has('super_attribute[' + attribute.id + ']')">
-                        @{{ errors.first('super_attribute[' + attribute.id + ']') }}
-                    </span>
+                    <span class="control-error" v-if="errors.has('super_attribute[' + attribute.id + ']')" v-text="errors.first('super_attribute[' + attribute.id + ']')"></span>
                 </div>
 
             </div>
diff --git a/packages/Webkul/Velocity/src/Resources/views/shop/products/view/downloadable.blade.php b/packages/Webkul/Velocity/src/Resources/views/shop/products/view/downloadable.blade.php
index ba76b7af4..f14d3a4b7 100644
--- a/packages/Webkul/Velocity/src/Resources/views/shop/products/view/downloadable.blade.php
+++ b/packages/Webkul/Velocity/src/Resources/views/shop/products/view/downloadable.blade.php
@@ -55,7 +55,7 @@
                     @endforeach
                 </ul>
 
-                <span class="control-error" v-if="errors.has('links[]')">@{{ errors.first('links[]') }}</span>
+                <span class="control-error" v-if="errors.has('links[]')" v-text="errors.first('links[]')"></span>
             </div>
         @endif
     </div>