Layui‑Vue 0.3.7 Release Notes and Theme Customization Guide

Version 0.3.7 introduces a new slider component with a step attribute for setting increments, adds an index.less stylesheet for basic theme customization, removes the global macros defineProps and defineEmits to eliminate console warnings, fixes compatibility issues of the menu component’s inverted and level attributes with string types, and upgrades icons-vue to 1.0.4 and layer-vue to 1.3.3.

Version 0.3.6 adds a result component for unified success/error pages, an exception component providing common 403/404/500 error pages, enhances the menu component with level , inverted , and theme attributes, fixes table header scrolling, and upgrades Vue to 3.2.29.

Version 0.3.5 brings a flexible split-panel layout component, adds a drawer type to the layer component, resolves warnings for tab-item closable and dropdown content positioning, and upgrades icons-vue to 1.0.3 and layer-vue to 1.3.1.

Theme Customization – After the new release, developers can customize primary colors, border radius, and other visual aspects by overriding global LESS variables such as @global-primary-color: #009688; , @global-checked-color: #5FB878; , and @global-border-radius: 2px; . Component‑specific variables (e.g., @button-primary-color , @button-border-radius ) can also be overridden.

@global-primary-color: #009688; // theme color
@global-checked-color: #5FB878; // selected color
@global-border-radius: 2px; // border radius

To apply custom themes, create a separate LESS file and import it after the official stylesheet:

@import '@layui/layui-vue/lib/index.less'; // official entry
@import 'your-theme-file.less'; // overrides

Exception Component – Provides predefined error pages (403, 404, 500) using the lay-exception tag, reducing repetitive coding for common error handling scenarios.

Result Component – Enables quick construction of success and failure feedback messages, complementing the exception pages for a complete UI feedback solution.