diff --git a/pages/accessibility/index.vue b/pages/accessibility/index.vue
index 774ce2bd7..d949e50d6 100644
--- a/pages/accessibility/index.vue
+++ b/pages/accessibility/index.vue
@@ -20,12 +20,12 @@
 </template>
 
 <script>
-import ColorsDoc from '@/doc/accessibility/ColorsDoc';
-import FormControlsDoc from '@/doc/accessibility/FormControlsDoc';
-import IntroductionDoc from '@/doc/accessibility/IntroductionDoc';
-import SemanticHTMLDoc from '@/doc/accessibility/SemanticHTMLDoc';
-import WAIAriaDoc from '@/doc/accessibility/WAIAriaDoc';
-import WCAGDoc from '@/doc/accessibility/WCAGDoc';
+import ColorsDoc from '@/doc/accessibility/ColorsDoc.vue';
+import FormControlsDoc from '@/doc/accessibility/FormControlsDoc.vue';
+import IntroductionDoc from '@/doc/accessibility/IntroductionDoc.vue';
+import SemanticHTMLDoc from '@/doc/accessibility/SemanticHTMLDoc.vue';
+import WAIAriaDoc from '@/doc/accessibility/WAIAriaDoc.vue';
+import WCAGDoc from '@/doc/accessibility/WCAGDoc.vue';
 
 export default {
     data() {
diff --git a/pages/accordion/index.vue b/pages/accordion/index.vue
index eb182e64e..bdebab20d 100755
--- a/pages/accordion/index.vue
+++ b/pages/accordion/index.vue
@@ -11,12 +11,12 @@
 </template>
 
 <script>
-import AccessibilityDoc from '@/doc/accordion/AccessibilityDoc';
-import BasicDoc from '@/doc/accordion/BasicDoc';
+import AccessibilityDoc from '@/doc/accordion/AccessibilityDoc.vue';
+import BasicDoc from '@/doc/accordion/BasicDoc.vue';
 import ControlledDoc from '@/doc/accordion/ControlledDoc.vue';
 import Disabled from '@/doc/accordion/DisabledDoc.vue';
-import DynamicDoc from '@/doc/accordion/DynamicDoc';
-import ImportDoc from '@/doc/accordion/ImportDoc';
+import DynamicDoc from '@/doc/accordion/DynamicDoc.vue';
+import ImportDoc from '@/doc/accordion/ImportDoc.vue';
 import MultipleDoc from '@/doc/accordion/MultipleDoc.vue';
 import TemplateDoc from '@/doc/accordion/TemplateDoc.vue';
 import PTComponent from '@/doc/accordion/pt/index.vue';
diff --git a/pages/autocomplete/index.vue b/pages/autocomplete/index.vue
index fa0b40e58..e1835f11a 100755
--- a/pages/autocomplete/index.vue
+++ b/pages/autocomplete/index.vue
@@ -11,19 +11,19 @@
 </template>
 
 <script>
-import AccessibilityDoc from '@/doc/autocomplete/AccessibilityDoc';
-import BasicDoc from '@/doc/autocomplete/BasicDoc';
-import DisabledDoc from '@/doc/autocomplete/DisabledDoc';
-import DropdownDoc from '@/doc/autocomplete/DropdownDoc';
-import FloatLabelDoc from '@/doc/autocomplete/FloatLabelDoc';
-import ForceSelectionDoc from '@/doc/autocomplete/ForceSelectionDoc';
-import GroupDoc from '@/doc/autocomplete/GroupDoc';
-import ImportDoc from '@/doc/autocomplete/ImportDoc';
-import InvalidDoc from '@/doc/autocomplete/InvalidDoc';
-import MultipleDoc from '@/doc/autocomplete/MultipleDoc';
-import ObjectsDoc from '@/doc/autocomplete/ObjectsDoc';
-import TemplateDoc from '@/doc/autocomplete/TemplateDoc';
-import VirtualScrollDoc from '@/doc/autocomplete/VirtualScrollDoc';
+import AccessibilityDoc from '@/doc/autocomplete/AccessibilityDoc.vue';
+import BasicDoc from '@/doc/autocomplete/BasicDoc.vue';
+import DisabledDoc from '@/doc/autocomplete/DisabledDoc.vue';
+import DropdownDoc from '@/doc/autocomplete/DropdownDoc.vue';
+import FloatLabelDoc from '@/doc/autocomplete/FloatLabelDoc.vue';
+import ForceSelectionDoc from '@/doc/autocomplete/ForceSelectionDoc.vue';
+import GroupDoc from '@/doc/autocomplete/GroupDoc.vue';
+import ImportDoc from '@/doc/autocomplete/ImportDoc.vue';
+import InvalidDoc from '@/doc/autocomplete/InvalidDoc.vue';
+import MultipleDoc from '@/doc/autocomplete/MultipleDoc.vue';
+import ObjectsDoc from '@/doc/autocomplete/ObjectsDoc.vue';
+import TemplateDoc from '@/doc/autocomplete/TemplateDoc.vue';
+import VirtualScrollDoc from '@/doc/autocomplete/VirtualScrollDoc.vue';
 import VeeValidateDoc from '@/doc/autocomplete/form/VeeValidateDoc.vue';
 import PTComponent from '@/doc/autocomplete/pt/index.vue';
 import ThemingDoc from '@/doc/autocomplete/theming/index.vue';
diff --git a/pages/avatar/index.vue b/pages/avatar/index.vue
index ba384fa5d..b29a18c91 100644
--- a/pages/avatar/index.vue
+++ b/pages/avatar/index.vue
@@ -12,11 +12,11 @@
 
 <script>
 import AccessibilityDoc from '@/doc/avatar/AccessibilityDoc';
-import AvatarGroupDoc from '@/doc/avatar/AvatarGroupDoc';
-import IconDoc from '@/doc/avatar/IconDoc';
-import ImageDoc from '@/doc/avatar/ImageDoc';
-import ImportDoc from '@/doc/avatar/ImportDoc';
-import LabelDoc from '@/doc/avatar/LabelDoc';
+import AvatarGroupDoc from '@/doc/avatar/AvatarGroupDoc.vue';
+import IconDoc from '@/doc/avatar/IconDoc.vue';
+import ImageDoc from '@/doc/avatar/ImageDoc.vue';
+import ImportDoc from '@/doc/avatar/ImportDoc.vue';
+import LabelDoc from '@/doc/avatar/LabelDoc.vue';
 import PTComponent from '@/doc/avatar/pt/index.vue';
 import ThemingDoc from '@/doc/avatar/theming/index.vue';
 
diff --git a/pages/bootstrap/index.vue b/pages/bootstrap/index.vue
index 89b899d3f..7d6dca7c8 100644
--- a/pages/bootstrap/index.vue
+++ b/pages/bootstrap/index.vue
@@ -19,8 +19,8 @@
 </template>
 
 <script>
-import ExampleDoc from '@/doc/bootstrap/ExampleDoc';
-import SetupDoc from '@/doc/bootstrap/SetupDoc';
+import ExampleDoc from '@/doc/bootstrap/ExampleDoc.vue';
+import SetupDoc from '@/doc/bootstrap/SetupDoc.vue';
 
 export default {
     data() {
diff --git a/pages/breadcrumb/index.vue b/pages/breadcrumb/index.vue
index 8bb085ec6..1fe4a7605 100755
--- a/pages/breadcrumb/index.vue
+++ b/pages/breadcrumb/index.vue
@@ -11,10 +11,10 @@
 </template>
 
 <script>
-import AccessibilityDoc from '@/doc/breadcrumb/AccessibilityDoc';
-import BasicDoc from '@/doc/breadcrumb/BasicDoc';
-import ImportDoc from '@/doc/breadcrumb/ImportDoc';
-import RouterDoc from '@/doc/breadcrumb/RouterDoc';
+import AccessibilityDoc from '@/doc/breadcrumb/AccessibilityDoc.vue';
+import BasicDoc from '@/doc/breadcrumb/BasicDoc.vue';
+import ImportDoc from '@/doc/breadcrumb/ImportDoc.vue';
+import RouterDoc from '@/doc/breadcrumb/RouterDoc.vue';
 import TemplateDoc from '@/doc/breadcrumb/TemplateDoc';
 import PTComponent from '@/doc/breadcrumb/pt/index.vue';
 import ThemingDoc from '@/doc/breadcrumb/theming/index.vue';
diff --git a/pages/bulma/index.vue b/pages/bulma/index.vue
index 2529a7ee0..b67d6d67e 100644
--- a/pages/bulma/index.vue
+++ b/pages/bulma/index.vue
@@ -19,8 +19,8 @@
 </template>
 
 <script>
-import ExampleDoc from '@/doc/bulma/ExampleDoc';
-import SetupDoc from '@/doc/bulma/SetupDoc';
+import ExampleDoc from '@/doc/bulma/ExampleDoc.vue';
+import SetupDoc from '@/doc/bulma/SetupDoc.vue';
 
 export default {
     data() {
diff --git a/pages/calendar/index.vue b/pages/calendar/index.vue
index 653b4103d..3bac6ee87 100755
--- a/pages/calendar/index.vue
+++ b/pages/calendar/index.vue
@@ -12,25 +12,25 @@
 
 <script>
 import AccessibilityDoc from '@/doc/calendar/AccessibilityDoc';
-import BasicDoc from '@/doc/calendar/BasicDoc';
-import ButtonBarDoc from '@/doc/calendar/ButtonBarDoc';
-import DateTemplateDoc from '@/doc/calendar/DateTemplateDoc';
-import DisabledDoc from '@/doc/calendar/DisabledDoc';
-import FloatLabelDoc from '@/doc/calendar/FloatLabelDoc';
-import FormatDoc from '@/doc/calendar/FormatDoc';
-import IconDoc from '@/doc/calendar/IconDoc';
-import ImportDoc from '@/doc/calendar/ImportDoc';
-import InlineDoc from '@/doc/calendar/InlineDoc';
-import InvalidDoc from '@/doc/calendar/InvalidDoc';
-import LocaleDoc from '@/doc/calendar/LocaleDoc';
-import MinMaxDoc from '@/doc/calendar/MinMaxDoc';
-import MonthPickerDoc from '@/doc/calendar/MonthPickerDoc';
-import MultipleDoc from '@/doc/calendar/MultipleDoc';
-import MultipleMonthsDoc from '@/doc/calendar/MultipleMonthsDoc';
-import RangeDoc from '@/doc/calendar/RangeDoc';
-import TimeDoc from '@/doc/calendar/TimeDoc';
-import TouchUIDoc from '@/doc/calendar/TouchUIDoc';
-import YearPickerDoc from '@/doc/calendar/YearPickerDoc';
+import BasicDoc from '@/doc/calendar/BasicDoc.vue';
+import ButtonBarDoc from '@/doc/calendar/ButtonBarDoc.vue';
+import DateTemplateDoc from '@/doc/calendar/DateTemplateDoc.vue';
+import DisabledDoc from '@/doc/calendar/DisabledDoc.vue';
+import FloatLabelDoc from '@/doc/calendar/FloatLabelDoc.vue';
+import FormatDoc from '@/doc/calendar/FormatDoc.vue';
+import IconDoc from '@/doc/calendar/IconDoc.vue';
+import ImportDoc from '@/doc/calendar/ImportDoc.vue';
+import InlineDoc from '@/doc/calendar/InlineDoc.vue';
+import InvalidDoc from '@/doc/calendar/InvalidDoc.vue';
+import LocaleDoc from '@/doc/calendar/LocaleDoc.vue';
+import MinMaxDoc from '@/doc/calendar/MinMaxDoc.vue';
+import MonthPickerDoc from '@/doc/calendar/MonthPickerDoc.vue';
+import MultipleDoc from '@/doc/calendar/MultipleDoc.vue';
+import MultipleMonthsDoc from '@/doc/calendar/MultipleMonthsDoc.vue';
+import RangeDoc from '@/doc/calendar/RangeDoc.vue';
+import TimeDoc from '@/doc/calendar/TimeDoc.vue';
+import TouchUIDoc from '@/doc/calendar/TouchUIDoc.vue';
+import YearPickerDoc from '@/doc/calendar/YearPickerDoc.vue';
 import VeeValidateDoc from '@/doc/calendar/form/VeeValidateDoc.vue';
 import PTComponent from '@/doc/calendar/pt/index.vue';
 import ThemingDoc from '@/doc/calendar/theming/index.vue';
diff --git a/pages/card/index.vue b/pages/card/index.vue
index f390a0cde..7b2d5b63d 100755
--- a/pages/card/index.vue
+++ b/pages/card/index.vue
@@ -3,10 +3,10 @@
 </template>
 
 <script>
-import AccessibilityDoc from '@/doc/card/AccessibilityDoc';
-import AdvancedDoc from '@/doc/card/AdvancedDoc';
-import BasicDoc from '@/doc/card/BasicDoc';
-import ImportDoc from '@/doc/card/ImportDoc';
+import AccessibilityDoc from '@/doc/card/AccessibilityDoc.vue';
+import AdvancedDoc from '@/doc/card/AdvancedDoc.vue';
+import BasicDoc from '@/doc/card/BasicDoc.vue';
+import ImportDoc from '@/doc/card/ImportDoc.vue';
 import PTComponent from '@/doc/card/pt/index.vue';
 import ThemingDoc from '@/doc/card/theming/index.vue';
 export default {
diff --git a/pages/carousel/index.vue b/pages/carousel/index.vue
index c5596f33a..1315bb0f0 100755
--- a/pages/carousel/index.vue
+++ b/pages/carousel/index.vue
@@ -11,13 +11,13 @@
 </template>
 
 <script>
-import AccessibilityDoc from '@/doc/carousel/AccessibilityDoc';
-import BasicDoc from '@/doc/carousel/BasicDoc';
-import CircularDoc from '@/doc/carousel/CircularDoc';
-import ImportDoc from '@/doc/carousel/ImportDoc';
-import NumScrollDoc from '@/doc/carousel/NumScrollDoc';
-import ResponsiveDoc from '@/doc/carousel/ResponsiveDoc';
-import VerticalDoc from '@/doc/carousel/VerticalDoc';
+import AccessibilityDoc from '@/doc/carousel/AccessibilityDoc.vue';
+import BasicDoc from '@/doc/carousel/BasicDoc.vue';
+import CircularDoc from '@/doc/carousel/CircularDoc.vue';
+import ImportDoc from '@/doc/carousel/ImportDoc.vue';
+import NumScrollDoc from '@/doc/carousel/NumScrollDoc.vue';
+import ResponsiveDoc from '@/doc/carousel/ResponsiveDoc.vue';
+import VerticalDoc from '@/doc/carousel/VerticalDoc.vue';
 import PTComponent from '@/doc/carousel/pt/index.vue';
 import ThemingDoc from '@/doc/carousel/theming/index.vue';
 
diff --git a/pages/cascadeselect/index.vue b/pages/cascadeselect/index.vue
index 24e69fdb3..f54f3947c 100644
--- a/pages/cascadeselect/index.vue
+++ b/pages/cascadeselect/index.vue
@@ -11,15 +11,15 @@
 </template>
 
 <script>
-import AccessibilityDoc from '@/doc/cascadeselect/AccessibilityDoc';
-import BasicDoc from '@/doc/cascadeselect/BasicDoc';
-import DisabledDoc from '@/doc/cascadeselect/DisabledDoc';
-import FloatLabelDoc from '@/doc/cascadeselect/FloatLabelDoc';
-import ImportDoc from '@/doc/cascadeselect/ImportDoc';
-import InvalidDoc from '@/doc/cascadeselect/InvalidDoc';
-import LoadingStateDoc from '@/doc/cascadeselect/LoadingStateDoc';
-import TemplateDoc from '@/doc/cascadeselect/TemplateDoc';
-import VeeValidateDoc from '@/doc/cascadeselect/form/VeeValidateDoc';
+import AccessibilityDoc from '@/doc/cascadeselect/AccessibilityDoc.vue';
+import BasicDoc from '@/doc/cascadeselect/BasicDoc.vue';
+import DisabledDoc from '@/doc/cascadeselect/DisabledDoc.vue';
+import FloatLabelDoc from '@/doc/cascadeselect/FloatLabelDoc.vue';
+import ImportDoc from '@/doc/cascadeselect/ImportDoc.vue';
+import InvalidDoc from '@/doc/cascadeselect/InvalidDoc.vue';
+import LoadingStateDoc from '@/doc/cascadeselect/LoadingStateDoc.vue';
+import TemplateDoc from '@/doc/cascadeselect/TemplateDoc.vue';
+import VeeValidateDoc from '@/doc/cascadeselect/form/VeeValidateDoc.vue';
 import PTComponent from '@/doc/cascadeselect/pt/index.vue';
 import ThemingDoc from '@/doc/cascadeselect/theming/index.vue';
 
diff --git a/pages/chart/index.vue b/pages/chart/index.vue
index d649e7ee8..8f73a95c9 100755
--- a/pages/chart/index.vue
+++ b/pages/chart/index.vue
@@ -11,21 +11,21 @@
 </template>
 
 <script>
-import AccessibilityDoc from '@/doc/chart/AccessibilityDoc';
-import BasicDoc from '@/doc/chart/BasicDoc';
-import ChartJSDoc from '@/doc/chart/ChartJSDoc';
-import ComboDoc from '@/doc/chart/ComboDoc';
-import DoughnutDoc from '@/doc/chart/DoughnutDoc';
-import HorizontalBarDoc from '@/doc/chart/HorizontalBarDoc';
-import ImportDoc from '@/doc/chart/ImportDoc';
-import LineDoc from '@/doc/chart/LineDoc';
-import LineStylesDoc from '@/doc/chart/LineStylesDoc';
-import MultiAxisDoc from '@/doc/chart/MultiAxisDoc';
-import PieChartDoc from '@/doc/chart/PieChartDoc';
-import PolarAreaDoc from '@/doc/chart/PolarAreaDoc';
-import RadarDoc from '@/doc/chart/RadarDoc';
-import StackedBarDoc from '@/doc/chart/StackedBarDoc';
-import VerticalBarDoc from '@/doc/chart/VerticalBarDoc';
+import AccessibilityDoc from '@/doc/chart/AccessibilityDoc.vue';
+import BasicDoc from '@/doc/chart/BasicDoc.vue';
+import ChartJSDoc from '@/doc/chart/ChartJSDoc.vue';
+import ComboDoc from '@/doc/chart/ComboDoc.vue';
+import DoughnutDoc from '@/doc/chart/DoughnutDoc.vue';
+import HorizontalBarDoc from '@/doc/chart/HorizontalBarDoc.vue';
+import ImportDoc from '@/doc/chart/ImportDoc.vue';
+import LineDoc from '@/doc/chart/LineDoc.vue';
+import LineStylesDoc from '@/doc/chart/LineStylesDoc.vue';
+import MultiAxisDoc from '@/doc/chart/MultiAxisDoc.vue';
+import PieChartDoc from '@/doc/chart/PieChartDoc.vue';
+import PolarAreaDoc from '@/doc/chart/PolarAreaDoc.vue';
+import RadarDoc from '@/doc/chart/RadarDoc.vue';
+import StackedBarDoc from '@/doc/chart/StackedBarDoc.vue';
+import VerticalBarDoc from '@/doc/chart/VerticalBarDoc.vue';
 import PTComponent from '@/doc/chart/pt/index.vue';
 import ThemingDoc from '@/doc/chart/theming/index.vue';
 
diff --git a/pages/checkbox/index.vue b/pages/checkbox/index.vue
index 2256d7799..b99cfd6a0 100755
--- a/pages/checkbox/index.vue
+++ b/pages/checkbox/index.vue
@@ -11,14 +11,14 @@
 </template>
 
 <script>
-import AccessibilityDoc from '@/doc/checkbox/AccessibilityDoc';
-import BasicDoc from '@/doc/checkbox/BasicDoc';
-import DisabledDoc from '@/doc/checkbox/DisabledDoc';
-import DynamicDoc from '@/doc/checkbox/DynamicDoc';
-import GroupDoc from '@/doc/checkbox/GroupDoc';
-import ImportDoc from '@/doc/checkbox/ImportDoc';
-import InvalidDoc from '@/doc/checkbox/InvalidDoc';
-import VeeValidateDoc from '@/doc/checkbox/form/VeeValidateDoc';
+import AccessibilityDoc from '@/doc/checkbox/AccessibilityDoc.vue';
+import BasicDoc from '@/doc/checkbox/BasicDoc.vue';
+import DisabledDoc from '@/doc/checkbox/DisabledDoc.vue';
+import DynamicDoc from '@/doc/checkbox/DynamicDoc.vue';
+import GroupDoc from '@/doc/checkbox/GroupDoc.vue';
+import ImportDoc from '@/doc/checkbox/ImportDoc.vue';
+import InvalidDoc from '@/doc/checkbox/InvalidDoc.vue';
+import VeeValidateDoc from '@/doc/checkbox/form/VeeValidateDoc.vue';
 import PTComponent from '@/doc/checkbox/pt/index.vue';
 import ThemingDoc from '@/doc/checkbox/theming/index.vue';
 
diff --git a/pages/chip/index.vue b/pages/chip/index.vue
index d62fd4c82..97c059302 100644
--- a/pages/chip/index.vue
+++ b/pages/chip/index.vue
@@ -3,12 +3,12 @@
 </template>
 
 <script>
-import AccessibilityDoc from '@/doc/chip/AccessibilityDoc';
-import BasicDoc from '@/doc/chip/BasicDoc';
-import IconDoc from '@/doc/chip/IconDoc';
-import ImageDoc from '@/doc/chip/ImageDoc';
-import ImportDoc from '@/doc/chip/ImportDoc';
-import TemplateDoc from '@/doc/chip/TemplateDoc';
+import AccessibilityDoc from '@/doc/chip/AccessibilityDoc.vue';
+import BasicDoc from '@/doc/chip/BasicDoc.vue';
+import IconDoc from '@/doc/chip/IconDoc.vue';
+import ImageDoc from '@/doc/chip/ImageDoc.vue';
+import ImportDoc from '@/doc/chip/ImportDoc.vue';
+import TemplateDoc from '@/doc/chip/TemplateDoc.vue';
 import PTComponent from '@/doc/chip/pt/index.vue';
 import ThemingDoc from '@/doc/chip/theming/index.vue';
 
diff --git a/pages/chips/index.vue b/pages/chips/index.vue
index 80a19b6a3..81a8397b1 100755
--- a/pages/chips/index.vue
+++ b/pages/chips/index.vue
@@ -3,15 +3,15 @@
 </template>
 
 <script>
-import AccessibilityDoc from '@/doc/chips/AccessibilityDoc';
-import BasicDoc from '@/doc/chips/BasicDoc';
-import DisabledDoc from '@/doc/chips/DisabledDoc';
-import FloatLabelDoc from '@/doc/chips/FloatLabelDoc';
-import ImportDoc from '@/doc/chips/ImportDoc';
-import InvalidDoc from '@/doc/chips/InvalidDoc';
-import SeparatorDoc from '@/doc/chips/SeparatorDoc';
-import TemplateDoc from '@/doc/chips/TemplateDoc';
-import VeeValidateDoc from '@/doc/chips/form/VeeValidateDoc';
+import AccessibilityDoc from '@/doc/chips/AccessibilityDoc.vue';
+import BasicDoc from '@/doc/chips/BasicDoc.vue';
+import DisabledDoc from '@/doc/chips/DisabledDoc.vue';
+import FloatLabelDoc from '@/doc/chips/FloatLabelDoc.vue';
+import ImportDoc from '@/doc/chips/ImportDoc.vue';
+import InvalidDoc from '@/doc/chips/InvalidDoc.vue';
+import SeparatorDoc from '@/doc/chips/SeparatorDoc.vue';
+import TemplateDoc from '@/doc/chips/TemplateDoc.vue';
+import VeeValidateDoc from '@/doc/chips/form/VeeValidateDoc.vue';
 import PTComponent from '@/doc/chips/pt/index.vue';
 import ThemingDoc from '@/doc/chips/theming/index.vue';
 
diff --git a/pages/colorpicker/index.vue b/pages/colorpicker/index.vue
index a596a70f2..6c45d9366 100755
--- a/pages/colorpicker/index.vue
+++ b/pages/colorpicker/index.vue
@@ -3,13 +3,13 @@
 </template>
 
 <script>
-import AccessibilityDoc from '@/doc/colorpicker/AccessibilityDoc';
-import BasicDoc from '@/doc/colorpicker/BasicDoc';
-import DisabledDoc from '@/doc/colorpicker/DisabledDoc';
-import FormatDoc from '@/doc/colorpicker/FormatDoc';
-import ImportDoc from '@/doc/colorpicker/ImportDoc';
-import InlineDoc from '@/doc/colorpicker/InlineDoc';
-import VeeValidateDoc from '@/doc/colorpicker/form/VeeValidateDoc';
+import AccessibilityDoc from '@/doc/colorpicker/AccessibilityDoc.vue';
+import BasicDoc from '@/doc/colorpicker/BasicDoc.vue';
+import DisabledDoc from '@/doc/colorpicker/DisabledDoc.vue';
+import FormatDoc from '@/doc/colorpicker/FormatDoc.vue';
+import ImportDoc from '@/doc/colorpicker/ImportDoc.vue';
+import InlineDoc from '@/doc/colorpicker/InlineDoc.vue';
+import VeeValidateDoc from '@/doc/colorpicker/form/VeeValidateDoc.vue';
 import PTComponent from '@/doc/colorpicker/pt/index.vue';
 import ThemingDoc from '@/doc/colorpicker/theming/index.vue';
 
diff --git a/pages/colors/index.vue b/pages/colors/index.vue
index 1969984f7..c21c6fbbb 100644
--- a/pages/colors/index.vue
+++ b/pages/colors/index.vue
@@ -19,9 +19,9 @@
 </template>
 
 <script>
-import OverviewDoc from '@/doc/colors/OverviewDoc';
-import PaletteDoc from '@/doc/colors/PaletteDoc';
-import SurfacesDoc from '@/doc/colors/SurfacesDoc';
+import OverviewDoc from '@/doc/colors/OverviewDoc.vue';
+import PaletteDoc from '@/doc/colors/PaletteDoc.vue';
+import SurfacesDoc from '@/doc/colors/SurfacesDoc.vue';
 
 export default {
     data() {
diff --git a/pages/configuration/index.vue b/pages/configuration/index.vue
index bbc36d22a..a965b9941 100644
--- a/pages/configuration/index.vue
+++ b/pages/configuration/index.vue
@@ -16,17 +16,17 @@
 </template>
 
 <script>
-import ImportDoc from '@/doc/configuration/ImportDoc';
-import InputStyleDoc from '@/doc/configuration/InputStyleDoc';
+import ImportDoc from '@/doc/configuration/ImportDoc.vue';
+import InputStyleDoc from '@/doc/configuration/InputStyleDoc.vue';
 import PTDoc from '@/doc/configuration/PTDoc.vue';
 import PTOptionsDoc from '@/doc/configuration/PTOptionsDoc.vue';
-import RippleDoc from '@/doc/configuration/RippleDoc';
-import UnstyledDoc from '@/doc/configuration/UnstyledDoc';
-import ZIndexDoc from '@/doc/configuration/ZIndexDoc';
-import NonceDoc from '@/doc/configuration/csp/NonceDoc';
-import LocaleApiDoc from '@/doc/configuration/locale/LocaleApiDoc';
-import RepositoryDoc from '@/doc/configuration/locale/RepositoryDoc';
-import SetLocaleDoc from '@/doc/configuration/locale/SetLocaleDoc';
+import RippleDoc from '@/doc/configuration/RippleDoc.vue';
+import UnstyledDoc from '@/doc/configuration/UnstyledDoc.vue';
+import ZIndexDoc from '@/doc/configuration/ZIndexDoc.vue';
+import NonceDoc from '@/doc/configuration/csp/NonceDoc.vue';
+import LocaleApiDoc from '@/doc/configuration/locale/LocaleApiDoc.vue';
+import RepositoryDoc from '@/doc/configuration/locale/RepositoryDoc.vue';
+import SetLocaleDoc from '@/doc/configuration/locale/SetLocaleDoc.vue';
 
 export default {
     data() {
diff --git a/pages/contextmenu/index.vue b/pages/contextmenu/index.vue
index 5a73eda05..196a1be08 100755
--- a/pages/contextmenu/index.vue
+++ b/pages/contextmenu/index.vue
@@ -11,11 +11,11 @@
 </template>
 
 <script>
-import AccessibilityDoc from '@/doc/contextmenu/AccessibilityDoc';
-import BasicDoc from '@/doc/contextmenu/BasicDoc';
-import DocumentDoc from '@/doc/contextmenu/DocumentDoc';
-import ImportDoc from '@/doc/contextmenu/ImportDoc';
-import RouterDoc from '@/doc/contextmenu/RouterDoc';
+import AccessibilityDoc from '@/doc/contextmenu/AccessibilityDoc.vue';
+import BasicDoc from '@/doc/contextmenu/BasicDoc.vue';
+import DocumentDoc from '@/doc/contextmenu/DocumentDoc.vue';
+import ImportDoc from '@/doc/contextmenu/ImportDoc.vue';
+import RouterDoc from '@/doc/contextmenu/RouterDoc.vue';
 import PTComponent from '@/doc/contextmenu/pt/index.vue';
 import ThemingDoc from '@/doc/contextmenu/theming/index.vue';
 
diff --git a/pages/datatable/index.vue b/pages/datatable/index.vue
index 136dd4b56..eb18cc254 100755
--- a/pages/datatable/index.vue
+++ b/pages/datatable/index.vue
@@ -11,55 +11,55 @@
 </template>
 
 <script>
-import AccessibilityDoc from '@/doc/datatable/AccessibilityDoc';
-import BasicDoc from '@/doc/datatable/BasicDoc';
-import ColumnGroupDoc from '@/doc/datatable/ColumnGroupDoc';
-import ColumnToggleDoc from '@/doc/datatable/ColumnToggleDoc';
-import ConditionalStyleDoc from '@/doc/datatable/ConditionalStyleDoc';
-import ContextMenuDoc from '@/doc/datatable/ContextMenuDoc';
-import DynamicColumnsDoc from '@/doc/datatable/DynamicColumnsDoc';
-import ExportDoc from '@/doc/datatable/ExportDoc';
-import GridLinesDoc from '@/doc/datatable/GridLinesDoc';
-import ImportDoc from '@/doc/datatable/ImportDoc';
-import LazyLoadDoc from '@/doc/datatable/LazyLoadDoc';
-import ReorderDoc from '@/doc/datatable/ReorderDoc';
-import RowExpansionDoc from '@/doc/datatable/RowExpansionDoc';
-import SizeDoc from '@/doc/datatable/SizeDoc';
-import StatefulDoc from '@/doc/datatable/StatefulDoc';
-import StripedRowsDoc from '@/doc/datatable/StripedRowsDoc';
-import TemplateDoc from '@/doc/datatable/TemplateDoc';
-import ExpandModeDoc from '@/doc/datatable/colresize/ExpandModeDoc';
-import FitModeDoc from '@/doc/datatable/colresize/FitModeDoc';
-import CellEditDoc from '@/doc/datatable/edit/CellEditDoc';
-import FilterSortEditDoc from '@/doc/datatable/edit/FilterSortEditDoc';
-import RowEditDoc from '@/doc/datatable/edit/RowEditDoc';
-import AdvancedFilterDoc from '@/doc/datatable/filter/AdvancedFilterDoc';
-import BasicFilterDoc from '@/doc/datatable/filter/BasicFilterDoc';
-import PaginatorBasicDoc from '@/doc/datatable/paginator/PaginatorBasicDoc';
-import PaginatorTemplateDoc from '@/doc/datatable/paginator/PaginatorTemplateDoc';
+import AccessibilityDoc from '@/doc/datatable/AccessibilityDoc.vue';
+import BasicDoc from '@/doc/datatable/BasicDoc.vue';
+import ColumnGroupDoc from '@/doc/datatable/ColumnGroupDoc.vue';
+import ColumnToggleDoc from '@/doc/datatable/ColumnToggleDoc.vue';
+import ConditionalStyleDoc from '@/doc/datatable/ConditionalStyleDoc.vue';
+import ContextMenuDoc from '@/doc/datatable/ContextMenuDoc.vue';
+import DynamicColumnsDoc from '@/doc/datatable/DynamicColumnsDoc.vue';
+import ExportDoc from '@/doc/datatable/ExportDoc.vue';
+import GridLinesDoc from '@/doc/datatable/GridLinesDoc.vue';
+import ImportDoc from '@/doc/datatable/ImportDoc.vue';
+import LazyLoadDoc from '@/doc/datatable/LazyLoadDoc.vue';
+import ReorderDoc from '@/doc/datatable/ReorderDoc.vue';
+import RowExpansionDoc from '@/doc/datatable/RowExpansionDoc.vue';
+import SizeDoc from '@/doc/datatable/SizeDoc.vue';
+import StatefulDoc from '@/doc/datatable/StatefulDoc.vue';
+import StripedRowsDoc from '@/doc/datatable/StripedRowsDoc.vue';
+import TemplateDoc from '@/doc/datatable/TemplateDoc.vue';
+import ExpandModeDoc from '@/doc/datatable/colresize/ExpandModeDoc.vue';
+import FitModeDoc from '@/doc/datatable/colresize/FitModeDoc.vue';
+import CellEditDoc from '@/doc/datatable/edit/CellEditDoc.vue';
+import FilterSortEditDoc from '@/doc/datatable/edit/FilterSortEditDoc.vue';
+import RowEditDoc from '@/doc/datatable/edit/RowEditDoc.vue';
+import AdvancedFilterDoc from '@/doc/datatable/filter/AdvancedFilterDoc.vue';
+import BasicFilterDoc from '@/doc/datatable/filter/BasicFilterDoc.vue';
+import PaginatorBasicDoc from '@/doc/datatable/paginator/PaginatorBasicDoc.vue';
+import PaginatorTemplateDoc from '@/doc/datatable/paginator/PaginatorTemplateDoc.vue';
 import PTComponent from '@/doc/datatable/pt/index.vue';
-import ExpandableRowGroupDoc from '@/doc/datatable/rowgroup/ExpandableRowGroupDoc';
-import RowSpanRowGroupDoc from '@/doc/datatable/rowgroup/RowSpanRowGroupDoc';
-import SubHeaderRowGroupDoc from '@/doc/datatable/rowgroup/SubHeaderRowGroupDoc';
-import CheckboxRowSelectionDoc from '@/doc/datatable/rowselection/CheckboxRowSelectionDoc';
-import MultipleRowsSelectionDoc from '@/doc/datatable/rowselection/MultipleRowsSelectionDoc';
-import RadioButtonRowSelectionDoc from '@/doc/datatable/rowselection/RadioButtonRowSelectionDoc';
-import RowSelectEventsDoc from '@/doc/datatable/rowselection/RowSelectEventsDoc';
-import SingleRowSelectionDoc from '@/doc/datatable/rowselection/SingleRowSelectionDoc';
-import CustomersDoc from '@/doc/datatable/samples/CustomersDoc';
-import ProductsDoc from '@/doc/datatable/samples/ProductsDoc';
-import FlexibleScrollDoc from '@/doc/datatable/scroll/FlexibleScrollDoc';
-import FrozenColumnsDoc from '@/doc/datatable/scroll/FrozenColumnsDoc';
-import FrozenRowsDoc from '@/doc/datatable/scroll/FrozenRowsDoc';
-import HorizontalScrollDoc from '@/doc/datatable/scroll/HorizontalScrollDoc';
-import VerticalScrollDoc from '@/doc/datatable/scroll/VerticalScrollDoc';
-import MultipleColumnsDoc from '@/doc/datatable/sort/MultipleColumnsDoc';
-import PresortDoc from '@/doc/datatable/sort/PresortDoc';
-import RemovableSortDoc from '@/doc/datatable/sort/RemovableSortDoc';
-import SingleColumnDoc from '@/doc/datatable/sort/SingleColumnDoc';
+import ExpandableRowGroupDoc from '@/doc/datatable/rowgroup/ExpandableRowGroupDoc.vue';
+import RowSpanRowGroupDoc from '@/doc/datatable/rowgroup/RowSpanRowGroupDoc.vue';
+import SubHeaderRowGroupDoc from '@/doc/datatable/rowgroup/SubHeaderRowGroupDoc.vue';
+import CheckboxRowSelectionDoc from '@/doc/datatable/rowselection/CheckboxRowSelectionDoc.vue';
+import MultipleRowsSelectionDoc from '@/doc/datatable/rowselection/MultipleRowsSelectionDoc.vue';
+import RadioButtonRowSelectionDoc from '@/doc/datatable/rowselection/RadioButtonRowSelectionDoc.vue';
+import RowSelectEventsDoc from '@/doc/datatable/rowselection/RowSelectEventsDoc.vue';
+import SingleRowSelectionDoc from '@/doc/datatable/rowselection/SingleRowSelectionDoc.vue';
+import CustomersDoc from '@/doc/datatable/samples/CustomersDoc.vue';
+import ProductsDoc from '@/doc/datatable/samples/ProductsDoc.vue';
+import FlexibleScrollDoc from '@/doc/datatable/scroll/FlexibleScrollDoc.vue';
+import FrozenColumnsDoc from '@/doc/datatable/scroll/FrozenColumnsDoc.vue';
+import FrozenRowsDoc from '@/doc/datatable/scroll/FrozenRowsDoc.vue';
+import HorizontalScrollDoc from '@/doc/datatable/scroll/HorizontalScrollDoc.vue';
+import VerticalScrollDoc from '@/doc/datatable/scroll/VerticalScrollDoc.vue';
+import MultipleColumnsDoc from '@/doc/datatable/sort/MultipleColumnsDoc.vue';
+import PresortDoc from '@/doc/datatable/sort/PresortDoc.vue';
+import RemovableSortDoc from '@/doc/datatable/sort/RemovableSortDoc.vue';
+import SingleColumnDoc from '@/doc/datatable/sort/SingleColumnDoc.vue';
 import ThemingDoc from '@/doc/datatable/theming/index.vue';
-import LazyVirtualScrollDoc from '@/doc/datatable/virtualscroll/LazyVirtualScrollDoc';
-import PreloadVirtualScrollDoc from '@/doc/datatable/virtualscroll/PreloadVirtualScrollDoc';
+import LazyVirtualScrollDoc from '@/doc/datatable/virtualscroll/LazyVirtualScrollDoc.vue';
+import PreloadVirtualScrollDoc from '@/doc/datatable/virtualscroll/PreloadVirtualScrollDoc.vue';
 
 export default {
     data() {
diff --git a/pages/dataview/index.vue b/pages/dataview/index.vue
index f344a5393..647efede8 100755
--- a/pages/dataview/index.vue
+++ b/pages/dataview/index.vue
@@ -11,14 +11,14 @@
 </template>
 
 <script>
-import AccessibilityDoc from '@/doc/dataview/AccessibilityDoc';
-import BasicDoc from '@/doc/dataview/BasicDoc';
-import ImportDoc from '@/doc/dataview/ImportDoc';
-import LayoutDoc from '@/doc/dataview/LayoutDoc';
-import LoadingDoc from '@/doc/dataview/LoadingDoc';
-import PaginationDoc from '@/doc/dataview/PaginationDoc';
-import PrimeFlexDoc from '@/doc/dataview/PrimeFlexDoc';
-import SortingDoc from '@/doc/dataview/SortingDoc';
+import AccessibilityDoc from '@/doc/dataview/AccessibilityDoc.vue';
+import BasicDoc from '@/doc/dataview/BasicDoc.vue';
+import ImportDoc from '@/doc/dataview/ImportDoc.vue';
+import LayoutDoc from '@/doc/dataview/LayoutDoc.vue';
+import LoadingDoc from '@/doc/dataview/LoadingDoc.vue';
+import PaginationDoc from '@/doc/dataview/PaginationDoc.vue';
+import PrimeFlexDoc from '@/doc/dataview/PrimeFlexDoc.vue';
+import SortingDoc from '@/doc/dataview/SortingDoc.vue';
 import PTComponent from '@/doc/dataview/pt/index.vue';
 import ThemingDoc from '@/doc/dataview/theming/index.vue';
 
diff --git a/pages/dialog/index.vue b/pages/dialog/index.vue
index f2b3aa6fc..56c8105a2 100755
--- a/pages/dialog/index.vue
+++ b/pages/dialog/index.vue
@@ -3,16 +3,16 @@
 </template>
 
 <script>
-import AccessibilityDoc from '@/doc/dialog/AccessibilityDoc';
-import BasicDoc from '@/doc/dialog/BasicDoc';
-import FooterDoc from '@/doc/dialog/FooterDoc';
-import ImportDoc from '@/doc/dialog/ImportDoc';
-import LongContentDoc from '@/doc/dialog/LongContentDoc';
-import MaximizableDoc from '@/doc/dialog/MaximizableDoc';
-import PositionDoc from '@/doc/dialog/PositionDoc';
-import ResponsiveDoc from '@/doc/dialog/ResponsiveDoc';
-import TemplateDoc from '@/doc/dialog/TemplateDoc';
-import WithoutModalDoc from '@/doc/dialog/WithoutModalDoc';
+import AccessibilityDoc from '@/doc/dialog/AccessibilityDoc.vue';
+import BasicDoc from '@/doc/dialog/BasicDoc.vue';
+import FooterDoc from '@/doc/dialog/FooterDoc.vue';
+import ImportDoc from '@/doc/dialog/ImportDoc.vue';
+import LongContentDoc from '@/doc/dialog/LongContentDoc.vue';
+import MaximizableDoc from '@/doc/dialog/MaximizableDoc.vue';
+import PositionDoc from '@/doc/dialog/PositionDoc.vue';
+import ResponsiveDoc from '@/doc/dialog/ResponsiveDoc.vue';
+import TemplateDoc from '@/doc/dialog/TemplateDoc.vue';
+import WithoutModalDoc from '@/doc/dialog/WithoutModalDoc.vue';
 import PTComponent from '@/doc/dialog/pt/index.vue';
 import ThemingDoc from '@/doc/dialog/theming/index.vue';
 
diff --git a/pages/dock/index.vue b/pages/dock/index.vue
index f3be85f91..b41e7a897 100644
--- a/pages/dock/index.vue
+++ b/pages/dock/index.vue
@@ -3,11 +3,11 @@
 </template>
 
 <script>
-import AccessibilityDoc from '@/doc/dock/AccessibilityDoc';
-import AdvancedDoc from '@/doc/dock/AdvancedDoc';
-import BasicDoc from '@/doc/dock/BasicDoc';
-import ImportDoc from '@/doc/dock/ImportDoc';
-import RouterDoc from '@/doc/dock/RouterDoc';
+import AccessibilityDoc from '@/doc/dock/AccessibilityDoc.vue';
+import AdvancedDoc from '@/doc/dock/AdvancedDoc.vue';
+import BasicDoc from '@/doc/dock/BasicDoc.vue';
+import ImportDoc from '@/doc/dock/ImportDoc.vue';
+import RouterDoc from '@/doc/dock/RouterDoc.vue';
 import PTComponent from '@/doc/dock/pt/index.vue';
 import ThemingDoc from '@/doc/dock/theming/index.vue';
 
diff --git a/pages/dropdown/index.vue b/pages/dropdown/index.vue
index 867fd912b..065987c8f 100755
--- a/pages/dropdown/index.vue
+++ b/pages/dropdown/index.vue
@@ -11,21 +11,21 @@
 </template>
 
 <script>
-import AccessibilityDoc from '@/doc/dropdown/AccessibilityDoc';
-import BasicDoc from '@/doc/dropdown/BasicDoc';
-import ClearIconDoc from '@/doc/dropdown/ClearIconDoc';
-import DisabledDoc from '@/doc/dropdown/DisabledDoc';
-import EditableDoc from '@/doc/dropdown/EditableDoc';
-import FilterDoc from '@/doc/dropdown/FilterDoc';
-import FloatLabelDoc from '@/doc/dropdown/FloatLabelDoc';
-import GroupDoc from '@/doc/dropdown/GroupDoc';
-import ImportDoc from '@/doc/dropdown/ImportDoc';
-import InvalidDoc from '@/doc/dropdown/InvalidDoc';
-import LazyVirtualScrollDoc from '@/doc/dropdown/LazyVirtualScrollDoc';
-import LoadingStateDoc from '@/doc/dropdown/LoadingStateDoc';
-import TemplateDoc from '@/doc/dropdown/TemplateDoc';
-import VirtualScrollDoc from '@/doc/dropdown/VirtualScrollDoc';
-import VeeValidateDoc from '@/doc/dropdown/form/VeeValidateDoc';
+import AccessibilityDoc from '@/doc/dropdown/AccessibilityDoc.vue';
+import BasicDoc from '@/doc/dropdown/BasicDoc.vue';
+import ClearIconDoc from '@/doc/dropdown/ClearIconDoc.vue';
+import DisabledDoc from '@/doc/dropdown/DisabledDoc.vue';
+import EditableDoc from '@/doc/dropdown/EditableDoc.vue';
+import FilterDoc from '@/doc/dropdown/FilterDoc.vue';
+import FloatLabelDoc from '@/doc/dropdown/FloatLabelDoc.vue';
+import GroupDoc from '@/doc/dropdown/GroupDoc.vue';
+import ImportDoc from '@/doc/dropdown/ImportDoc.vue';
+import InvalidDoc from '@/doc/dropdown/InvalidDoc.vue';
+import LazyVirtualScrollDoc from '@/doc/dropdown/LazyVirtualScrollDoc.vue';
+import LoadingStateDoc from '@/doc/dropdown/LoadingStateDoc.vue';
+import TemplateDoc from '@/doc/dropdown/TemplateDoc.vue';
+import VirtualScrollDoc from '@/doc/dropdown/VirtualScrollDoc.vue';
+import VeeValidateDoc from '@/doc/dropdown/form/VeeValidateDoc.vue';
 import PTComponent from '@/doc/dropdown/pt/index.vue';
 import ThemingDoc from '@/doc/dropdown/theming/index.vue';
 
diff --git a/pages/dynamicdialog/index.vue b/pages/dynamicdialog/index.vue
index a49585961..87fd5e793 100644
--- a/pages/dynamicdialog/index.vue
+++ b/pages/dynamicdialog/index.vue
@@ -11,15 +11,15 @@
 </template>
 
 <script>
-import AccessibilityDoc from '@/doc/dynamicdialog/AccessibilityDoc';
-import CloseDialogDoc from '@/doc/dynamicdialog/CloseDialogDoc';
-import CustomizationDoc from '@/doc/dynamicdialog/CustomizationDoc';
-import DialogServiceDoc from '@/doc/dynamicdialog/DialogServiceDoc';
-import EmitsDoc from '@/doc/dynamicdialog/EmitsDoc';
-import ImportDoc from '@/doc/dynamicdialog/ImportDoc';
-import OpenDialogDoc from '@/doc/dynamicdialog/OpenDialogDoc';
-import PassingDataDoc from '@/doc/dynamicdialog/PassingDataDoc';
-import UsageDoc from '@/doc/dynamicdialog/UsageDoc';
+import AccessibilityDoc from '@/doc/dynamicdialog/AccessibilityDoc.vue';
+import CloseDialogDoc from '@/doc/dynamicdialog/CloseDialogDoc.vue';
+import CustomizationDoc from '@/doc/dynamicdialog/CustomizationDoc.vue';
+import DialogServiceDoc from '@/doc/dynamicdialog/DialogServiceDoc.vue';
+import EmitsDoc from '@/doc/dynamicdialog/EmitsDoc.vue';
+import ImportDoc from '@/doc/dynamicdialog/ImportDoc.vue';
+import OpenDialogDoc from '@/doc/dynamicdialog/OpenDialogDoc.vue';
+import PassingDataDoc from '@/doc/dynamicdialog/PassingDataDoc.vue';
+import UsageDoc from '@/doc/dynamicdialog/UsageDoc.vue';
 import PTComponent from '@/doc/dynamicdialog/pt/index.vue';
 import ThemingDoc from '@/doc/dynamicdialog/theming/index.vue';
 
diff --git a/pages/galleria/index.vue b/pages/galleria/index.vue
index 517b7235a..32fdc8965 100755
--- a/pages/galleria/index.vue
+++ b/pages/galleria/index.vue
@@ -3,26 +3,26 @@
 </template>
 
 <script>
-import AccessibilityDoc from '@/doc/galleria/AccessibilityDoc';
-import AdvancedDoc from '@/doc/galleria/AdvancedDoc';
-import AutoPlayDoc from '@/doc/galleria/AutoPlayDoc';
-import BasicDoc from '@/doc/galleria/BasicDoc';
-import CaptionDoc from '@/doc/galleria/CaptionDoc';
-import ControlledDoc from '@/doc/galleria/ControlledDoc';
-import ImportDoc from '@/doc/galleria/ImportDoc';
-import ResponsiveDoc from '@/doc/galleria/ResponsiveDoc';
-import ThumbnailDoc from '@/doc/galleria/ThumbnailDoc';
-import CustomContentDoc from '@/doc/galleria/fullscreen/CustomContentDoc';
-import WithThumbnailsDoc from '@/doc/galleria/fullscreen/WithThumbnailsDoc';
-import WithoutThumbnailsDoc from '@/doc/galleria/fullscreen/WithoutThumbnailsDoc';
-import ClickEventDoc from '@/doc/galleria/indicator/ClickEventDoc';
-import HoverEventDoc from '@/doc/galleria/indicator/HoverEventDoc';
-import PositionDoc from '@/doc/galleria/indicator/PositionDoc';
-import TemplateDoc from '@/doc/galleria/indicator/TemplateDoc';
-import HoverDoc from '@/doc/galleria/navigator/HoverDoc';
-import IndicatorsDoc from '@/doc/galleria/navigator/IndicatorsDoc';
-import ItemThumbnailsDoc from '@/doc/galleria/navigator/ItemThumbnailsDoc';
-import ItemWithoutThumbnailsDoc from '@/doc/galleria/navigator/ItemWithoutThumbnailsDoc';
+import AccessibilityDoc from '@/doc/galleria/AccessibilityDoc.vue';
+import AdvancedDoc from '@/doc/galleria/AdvancedDoc.vue';
+import AutoPlayDoc from '@/doc/galleria/AutoPlayDoc.vue';
+import BasicDoc from '@/doc/galleria/BasicDoc.vue';
+import CaptionDoc from '@/doc/galleria/CaptionDoc.vue';
+import ControlledDoc from '@/doc/galleria/ControlledDoc.vue';
+import ImportDoc from '@/doc/galleria/ImportDoc.vue';
+import ResponsiveDoc from '@/doc/galleria/ResponsiveDoc.vue';
+import ThumbnailDoc from '@/doc/galleria/ThumbnailDoc.vue';
+import CustomContentDoc from '@/doc/galleria/fullscreen/CustomContentDoc.vue';
+import WithThumbnailsDoc from '@/doc/galleria/fullscreen/WithThumbnailsDoc.vue';
+import WithoutThumbnailsDoc from '@/doc/galleria/fullscreen/WithoutThumbnailsDoc.vue';
+import ClickEventDoc from '@/doc/galleria/indicator/ClickEventDoc.vue';
+import HoverEventDoc from '@/doc/galleria/indicator/HoverEventDoc.vue';
+import PositionDoc from '@/doc/galleria/indicator/PositionDoc.vue';
+import TemplateDoc from '@/doc/galleria/indicator/TemplateDoc.vue';
+import HoverDoc from '@/doc/galleria/navigator/HoverDoc.vue';
+import IndicatorsDoc from '@/doc/galleria/navigator/IndicatorsDoc.vue';
+import ItemThumbnailsDoc from '@/doc/galleria/navigator/ItemThumbnailsDoc.vue';
+import ItemWithoutThumbnailsDoc from '@/doc/galleria/navigator/ItemWithoutThumbnailsDoc.vue';
 import PTComponent from '@/doc/galleria/pt/index.vue';
 import ThemingDoc from '@/doc/galleria/theming/index.vue';
 
diff --git a/pages/icons/index.vue b/pages/icons/index.vue
index 89cadb22e..a60bdee00 100755
--- a/pages/icons/index.vue
+++ b/pages/icons/index.vue
@@ -22,14 +22,14 @@
 </template>
 
 <script>
-import BasicDoc from '@/doc/icons/BasicDoc';
-import ColorDoc from '@/doc/icons/ColorDoc';
-import ConstantsDoc from '@/doc/icons/ConstantsDoc';
-import DownloadDoc from '@/doc/icons/DownloadDoc';
-import ImportDoc from '@/doc/icons/ImportDoc';
-import ListDoc from '@/doc/icons/ListDoc';
-import SizeDoc from '@/doc/icons/SizeDoc';
-import SpinDoc from '@/doc/icons/SpinDoc';
+import BasicDoc from '@/doc/icons/BasicDoc.vue';
+import ColorDoc from '@/doc/icons/ColorDoc.vue';
+import ConstantsDoc from '@/doc/icons/ConstantsDoc.vue';
+import DownloadDoc from '@/doc/icons/DownloadDoc.vue';
+import ImportDoc from '@/doc/icons/ImportDoc.vue';
+import ListDoc from '@/doc/icons/ListDoc.vue';
+import SizeDoc from '@/doc/icons/SizeDoc.vue';
+import SpinDoc from '@/doc/icons/SpinDoc.vue';
 
 export default {
     data() {
diff --git a/pages/image/index.vue b/pages/image/index.vue
index d1736d012..94b67ff80 100644
--- a/pages/image/index.vue
+++ b/pages/image/index.vue
@@ -3,11 +3,11 @@
 </template>
 
 <script>
-import AccessibilityDoc from '@/doc/image/AccessibilityDoc';
-import BasicDoc from '@/doc/image/BasicDoc';
-import ImportDoc from '@/doc/image/ImportDoc';
-import PreviewDoc from '@/doc/image/PreviewDoc';
-import TemplateDoc from '@/doc/image/TemplateDoc';
+import AccessibilityDoc from '@/doc/image/AccessibilityDoc.vue';
+import BasicDoc from '@/doc/image/BasicDoc.vue';
+import ImportDoc from '@/doc/image/ImportDoc.vue';
+import PreviewDoc from '@/doc/image/PreviewDoc.vue';
+import TemplateDoc from '@/doc/image/TemplateDoc.vue';
 import PTComponent from '@/doc/image/pt/index.vue';
 import ThemingDoc from '@/doc/image/theming/index.vue';
 
diff --git a/pages/inplace/index.vue b/pages/inplace/index.vue
index efab20e8c..1fd2590c1 100755
--- a/pages/inplace/index.vue
+++ b/pages/inplace/index.vue
@@ -11,12 +11,12 @@
 </template>
 
 <script>
-import AccessibilityDoc from '@/doc/inplace/AccessibilityDoc';
-import BasicDoc from '@/doc/inplace/BasicDoc';
-import ImageDoc from '@/doc/inplace/ImageDoc';
-import ImportDoc from '@/doc/inplace/ImportDoc';
-import InputDoc from '@/doc/inplace/InputDoc';
-import LazyDoc from '@/doc/inplace/LazyDoc';
+import AccessibilityDoc from '@/doc/inplace/AccessibilityDoc.vue';
+import BasicDoc from '@/doc/inplace/BasicDoc.vue';
+import ImageDoc from '@/doc/inplace/ImageDoc.vue';
+import ImportDoc from '@/doc/inplace/ImportDoc.vue';
+import InputDoc from '@/doc/inplace/InputDoc.vue';
+import LazyDoc from '@/doc/inplace/LazyDoc.vue';
 import PTComponent from '@/doc/inplace/pt/index.vue';
 import ThemingDoc from '@/doc/inplace/theming/index.vue';
 
diff --git a/pages/inputgroup/index.vue b/pages/inputgroup/index.vue
index 4a0c40610..714c73a49 100755
--- a/pages/inputgroup/index.vue
+++ b/pages/inputgroup/index.vue
@@ -3,10 +3,10 @@
 </template>
 
 <script>
-import BasicDoc from '@/doc/inputgroup/BasicDoc';
-import ButtonDoc from '@/doc/inputgroup/ButtonDoc';
-import CheckboxDoc from '@/doc/inputgroup/CheckboxDoc';
-import MultipleDoc from '@/doc/inputgroup/MultipleDoc';
+import BasicDoc from '@/doc/inputgroup/BasicDoc.vue';
+import ButtonDoc from '@/doc/inputgroup/ButtonDoc.vue';
+import CheckboxDoc from '@/doc/inputgroup/CheckboxDoc.vue';
+import MultipleDoc from '@/doc/inputgroup/MultipleDoc.vue';
 
 export default {
     data() {
diff --git a/pages/inputnumber/index.vue b/pages/inputnumber/index.vue
index 687714400..07abbbe13 100755
--- a/pages/inputnumber/index.vue
+++ b/pages/inputnumber/index.vue
@@ -11,18 +11,18 @@
 </template>
 
 <script>
-import AccessibilityDoc from '@/doc/inputnumber/AccessibilityDoc';
-import ButtonsDoc from '@/doc/inputnumber/ButtonsDoc';
-import CurrencyDoc from '@/doc/inputnumber/CurrencyDoc';
-import DisabledDoc from '@/doc/inputnumber/DisabledDoc';
-import FloatLabelDoc from '@/doc/inputnumber/FloatLabelDoc';
-import ImportDoc from '@/doc/inputnumber/ImportDoc';
-import InvalidDoc from '@/doc/inputnumber/InvalidDoc';
-import LocaleDoc from '@/doc/inputnumber/LocaleDoc';
-import NumeralsDoc from '@/doc/inputnumber/NumeralsDoc';
-import PrefixSuffixDoc from '@/doc/inputnumber/PrefixSuffixDoc';
-import VerticalDoc from '@/doc/inputnumber/VerticalDoc';
-import VeeValidateDoc from '@/doc/inputnumber/form/VeeValidateDoc';
+import AccessibilityDoc from '@/doc/inputnumber/AccessibilityDoc.vue';
+import ButtonsDoc from '@/doc/inputnumber/ButtonsDoc.vue';
+import CurrencyDoc from '@/doc/inputnumber/CurrencyDoc.vue';
+import DisabledDoc from '@/doc/inputnumber/DisabledDoc.vue';
+import FloatLabelDoc from '@/doc/inputnumber/FloatLabelDoc.vue';
+import ImportDoc from '@/doc/inputnumber/ImportDoc.vue';
+import InvalidDoc from '@/doc/inputnumber/InvalidDoc.vue';
+import LocaleDoc from '@/doc/inputnumber/LocaleDoc.vue';
+import NumeralsDoc from '@/doc/inputnumber/NumeralsDoc.vue';
+import PrefixSuffixDoc from '@/doc/inputnumber/PrefixSuffixDoc.vue';
+import VerticalDoc from '@/doc/inputnumber/VerticalDoc.vue';
+import VeeValidateDoc from '@/doc/inputnumber/form/VeeValidateDoc.vue';
 import PTComponent from '@/doc/inputnumber/pt/index.vue';
 import ThemingDoc from '@/doc/inputnumber/theming/index.vue';
 
diff --git a/pages/installation/index.vue b/pages/installation/index.vue
index 99496f033..f679d3122 100644
--- a/pages/installation/index.vue
+++ b/pages/installation/index.vue
@@ -16,16 +16,16 @@
 </template>
 
 <script>
-import DownloadDoc from '@/doc/installation/DownloadDoc';
-import ExamplesDoc from '@/doc/installation/ExamplesDoc';
-import NuxtIntegrationDoc from '@/doc/installation/NuxtIntegrationDoc';
-import PluginDoc from '@/doc/installation/PluginDoc';
-import PropCasesDoc from '@/doc/installation/PropCasesDoc';
-import StyledModeDoc from '@/doc/installation/StyledModeDoc';
-import UnstyledModeDoc from '@/doc/installation/UnstyledModeDoc';
-import UsageDoc from '@/doc/installation/UsageDoc';
-import CreateVueDoc from '@/doc/installation/videos/CreateVueDoc';
-import NuxtDoc from '@/doc/installation/videos/NuxtDoc';
+import DownloadDoc from '@/doc/installation/DownloadDoc.vue';
+import ExamplesDoc from '@/doc/installation/ExamplesDoc.vue';
+import NuxtIntegrationDoc from '@/doc/installation/NuxtIntegrationDoc.vue';
+import PluginDoc from '@/doc/installation/PluginDoc.vue';
+import PropCasesDoc from '@/doc/installation/PropCasesDoc.vue';
+import StyledModeDoc from '@/doc/installation/StyledModeDoc.vue';
+import UnstyledModeDoc from '@/doc/installation/UnstyledModeDoc.vue';
+import UsageDoc from '@/doc/installation/UsageDoc.vue';
+import CreateVueDoc from '@/doc/installation/videos/CreateVueDoc.vue';
+import NuxtDoc from '@/doc/installation/videos/NuxtDoc.vue';
 
 export default {
     data() {
diff --git a/pages/listbox/index.vue b/pages/listbox/index.vue
index 6b953e12b..714337845 100755
--- a/pages/listbox/index.vue
+++ b/pages/listbox/index.vue
@@ -3,17 +3,17 @@
 </template>
 
 <script>
-import AccessibilityDoc from '@/doc/listbox/AccessibilityDoc';
-import BasicDoc from '@/doc/listbox/BasicDoc';
-import DisabledDoc from '@/doc/listbox/DisabledDoc';
-import FilterDoc from '@/doc/listbox/FilterDoc';
-import GroupDoc from '@/doc/listbox/GroupDoc';
-import ImportDoc from '@/doc/listbox/ImportDoc';
-import InvalidDoc from '@/doc/listbox/InvalidDoc';
-import MultipleDoc from '@/doc/listbox/MultipleDoc';
-import TemplateDoc from '@/doc/listbox/TemplateDoc';
-import VirtualScrollDoc from '@/doc/listbox/VirtualScrollDoc';
-import VeeValidateDoc from '@/doc/listbox/form/VeeValidateDoc';
+import AccessibilityDoc from '@/doc/listbox/AccessibilityDoc.vue';
+import BasicDoc from '@/doc/listbox/BasicDoc.vue';
+import DisabledDoc from '@/doc/listbox/DisabledDoc.vue';
+import FilterDoc from '@/doc/listbox/FilterDoc.vue';
+import GroupDoc from '@/doc/listbox/GroupDoc.vue';
+import ImportDoc from '@/doc/listbox/ImportDoc.vue';
+import InvalidDoc from '@/doc/listbox/InvalidDoc.vue';
+import MultipleDoc from '@/doc/listbox/MultipleDoc.vue';
+import TemplateDoc from '@/doc/listbox/TemplateDoc.vue';
+import VirtualScrollDoc from '@/doc/listbox/VirtualScrollDoc.vue';
+import VeeValidateDoc from '@/doc/listbox/form/VeeValidateDoc.vue';
 import PTComponent from '@/doc/listbox/pt/index.vue';
 import ThemingDoc from '@/doc/listbox/theming/index.vue';
 
diff --git a/pages/megamenu/index.vue b/pages/megamenu/index.vue
index 110bba955..ed8e8f69c 100755
--- a/pages/megamenu/index.vue
+++ b/pages/megamenu/index.vue
@@ -11,12 +11,12 @@
 </template>
 
 <script>
-import AccessibilityDoc from '@/doc/megamenu/AccessibilityDoc';
-import BasicDoc from '@/doc/megamenu/BasicDoc';
-import ImportDoc from '@/doc/megamenu/ImportDoc';
-import RouterDoc from '@/doc/megamenu/RouterDoc';
-import TemplateDoc from '@/doc/megamenu/TemplateDoc';
-import VerticalDoc from '@/doc/megamenu/VerticalDoc';
+import AccessibilityDoc from '@/doc/megamenu/AccessibilityDoc.vue';
+import BasicDoc from '@/doc/megamenu/BasicDoc.vue';
+import ImportDoc from '@/doc/megamenu/ImportDoc.vue';
+import RouterDoc from '@/doc/megamenu/RouterDoc.vue';
+import TemplateDoc from '@/doc/megamenu/TemplateDoc.vue';
+import VerticalDoc from '@/doc/megamenu/VerticalDoc.vue';
 import PTComponent from '@/doc/megamenu/pt/index.vue';
 import ThemingDoc from '@/doc/megamenu/theming/index.vue';
 
diff --git a/pages/menu/index.vue b/pages/menu/index.vue
index cdb9b497d..d5034a38e 100755
--- a/pages/menu/index.vue
+++ b/pages/menu/index.vue
@@ -11,13 +11,13 @@
 </template>
 
 <script>
-import AccessibilityDoc from '@/doc/menu/AccessibilityDoc';
-import BasicDoc from '@/doc/menu/BasicDoc';
-import GroupDoc from '@/doc/menu/GroupDoc';
-import ImportDoc from '@/doc/menu/ImportDoc';
-import PopupDoc from '@/doc/menu/PopupDoc';
-import RouterDoc from '@/doc/menu/RouterDoc';
-import TemplateDoc from '@/doc/menu/TemplateDoc';
+import AccessibilityDoc from '@/doc/menu/AccessibilityDoc.vue';
+import BasicDoc from '@/doc/menu/BasicDoc.vue';
+import GroupDoc from '@/doc/menu/GroupDoc.vue';
+import ImportDoc from '@/doc/menu/ImportDoc.vue';
+import PopupDoc from '@/doc/menu/PopupDoc.vue';
+import RouterDoc from '@/doc/menu/RouterDoc.vue';
+import TemplateDoc from '@/doc/menu/TemplateDoc.vue';
 import PTComponent from '@/doc/menu/pt/index.vue';
 import ThemingDoc from '@/doc/menu/theming/index.vue';
 
diff --git a/pages/menubar/index.vue b/pages/menubar/index.vue
index a69d00d5d..0153ca0d1 100755
--- a/pages/menubar/index.vue
+++ b/pages/menubar/index.vue
@@ -11,11 +11,11 @@
 </template>
 
 <script>
-import AccessibilityDoc from '@/doc/menubar/AccessibilityDoc';
-import BasicDoc from '@/doc/menubar/BasicDoc';
-import ImportDoc from '@/doc/menubar/ImportDoc';
-import RouterDoc from '@/doc/menubar/RouterDoc';
-import TemplateDoc from '@/doc/menubar/TemplateDoc';
+import AccessibilityDoc from '@/doc/menubar/AccessibilityDoc.vue';
+import BasicDoc from '@/doc/menubar/BasicDoc.vue';
+import ImportDoc from '@/doc/menubar/ImportDoc.vue';
+import RouterDoc from '@/doc/menubar/RouterDoc.vue';
+import TemplateDoc from '@/doc/menubar/TemplateDoc.vue';
 import PTComponent from '@/doc/menubar/pt/index.vue';
 import ThemingDoc from '@/doc/menubar/theming/index.vue';
 
diff --git a/pages/multiselect/index.vue b/pages/multiselect/index.vue
index e3a861867..126962259 100755
--- a/pages/multiselect/index.vue
+++ b/pages/multiselect/index.vue
@@ -11,19 +11,19 @@
 </template>
 
 <script>
-import AccessibilityDoc from '@/doc/multiselect/AccessibilityDoc';
-import BasicDoc from '@/doc/multiselect/BasicDoc';
-import ChipsDoc from '@/doc/multiselect/ChipsDoc';
-import DisabledDoc from '@/doc/multiselect/DisabledDoc';
-import FilterDoc from '@/doc/multiselect/FilterDoc';
-import FloatLabelDoc from '@/doc/multiselect/FloatLabelDoc';
-import GroupDoc from '@/doc/multiselect/GroupDoc';
-import ImportDoc from '@/doc/multiselect/ImportDoc';
-import InvalidDoc from '@/doc/multiselect/InvalidDoc';
-import LoadingStateDoc from '@/doc/multiselect/LoadingStateDoc';
-import TemplateDoc from '@/doc/multiselect/TemplateDoc';
-import VirtualScrollDoc from '@/doc/multiselect/VirtualScrollDoc';
-import VeeValidateDoc from '@/doc/multiselect/form/VeeValidateDoc';
+import AccessibilityDoc from '@/doc/multiselect/AccessibilityDoc.vue';
+import BasicDoc from '@/doc/multiselect/BasicDoc.vue';
+import ChipsDoc from '@/doc/multiselect/ChipsDoc.vue';
+import DisabledDoc from '@/doc/multiselect/DisabledDoc.vue';
+import FilterDoc from '@/doc/multiselect/FilterDoc.vue';
+import FloatLabelDoc from '@/doc/multiselect/FloatLabelDoc.vue';
+import GroupDoc from '@/doc/multiselect/GroupDoc.vue';
+import ImportDoc from '@/doc/multiselect/ImportDoc.vue';
+import InvalidDoc from '@/doc/multiselect/InvalidDoc.vue';
+import LoadingStateDoc from '@/doc/multiselect/LoadingStateDoc.vue';
+import TemplateDoc from '@/doc/multiselect/TemplateDoc.vue';
+import VirtualScrollDoc from '@/doc/multiselect/VirtualScrollDoc.vue';
+import VeeValidateDoc from '@/doc/multiselect/form/VeeValidateDoc.vue';
 import PTComponent from '@/doc/multiselect/pt/index.vue';
 import ThemingDoc from '@/doc/multiselect/theming/index.vue';
 
diff --git a/pages/organizationchart/index.vue b/pages/organizationchart/index.vue
index a92d63ed1..5c315c5c7 100755
--- a/pages/organizationchart/index.vue
+++ b/pages/organizationchart/index.vue
@@ -11,12 +11,12 @@
 </template>
 
 <script>
-import AccessibilityDoc from '@/doc/organizationchart/AccessibilityDoc';
-import BasicDoc from '@/doc/organizationchart/BasicDoc';
-import ColoredDoc from '@/doc/organizationchart/ColoredDoc';
-import ImportDoc from '@/doc/organizationchart/ImportDoc';
-import SelectionDoc from '@/doc/organizationchart/SelectionDoc';
-import TemplateDoc from '@/doc/organizationchart/TemplateDoc';
+import AccessibilityDoc from '@/doc/organizationchart/AccessibilityDoc.vue';
+import BasicDoc from '@/doc/organizationchart/BasicDoc.vue';
+import ColoredDoc from '@/doc/organizationchart/ColoredDoc.vue';
+import ImportDoc from '@/doc/organizationchart/ImportDoc.vue';
+import SelectionDoc from '@/doc/organizationchart/SelectionDoc.vue';
+import TemplateDoc from '@/doc/organizationchart/TemplateDoc.vue';
 import PTComponent from '@/doc/organizationchart/pt/index.vue';
 import ThemingDoc from '@/doc/organizationchart/theming/index.vue';
 
diff --git a/pages/overlaypanel/index.vue b/pages/overlaypanel/index.vue
index 5b86ad953..bc2417ab4 100755
--- a/pages/overlaypanel/index.vue
+++ b/pages/overlaypanel/index.vue
@@ -11,10 +11,10 @@
 </template>
 
 <script>
-import AccessibilityDoc from '@/doc/overlaypanel/AccessibilityDoc';
-import BasicDoc from '@/doc/overlaypanel/BasicDoc';
-import DataTableDoc from '@/doc/overlaypanel/DataTableDoc';
-import ImportDoc from '@/doc/overlaypanel/ImportDoc';
+import AccessibilityDoc from '@/doc/overlaypanel/AccessibilityDoc.vue';
+import BasicDoc from '@/doc/overlaypanel/BasicDoc.vue';
+import DataTableDoc from '@/doc/overlaypanel/DataTableDoc.vue';
+import ImportDoc from '@/doc/overlaypanel/ImportDoc.vue';
 import PTComponent from '@/doc/overlaypanel/pt/index.vue';
 import ThemingDoc from '@/doc/overlaypanel/theming/index.vue';
 
diff --git a/pages/panelmenu/index.vue b/pages/panelmenu/index.vue
index 5df76fdc7..4da02de32 100755
--- a/pages/panelmenu/index.vue
+++ b/pages/panelmenu/index.vue
@@ -11,12 +11,12 @@
 </template>
 
 <script>
-import AccessibilityDoc from '@/doc/panelmenu/AccessibilityDoc';
-import BasicDoc from '@/doc/panelmenu/BasicDoc';
-import ImportDoc from '@/doc/panelmenu/ImportDoc';
-import MultipleDoc from '@/doc/panelmenu/MultipleDoc';
-import ProgrammaticDoc from '@/doc/panelmenu/ProgrammaticDoc';
-import RouterDoc from '@/doc/panelmenu/RouterDoc';
+import AccessibilityDoc from '@/doc/panelmenu/AccessibilityDoc.vue';
+import BasicDoc from '@/doc/panelmenu/BasicDoc.vue';
+import ImportDoc from '@/doc/panelmenu/ImportDoc.vue';
+import MultipleDoc from '@/doc/panelmenu/MultipleDoc.vue';
+import ProgrammaticDoc from '@/doc/panelmenu/ProgrammaticDoc.vue';
+import RouterDoc from '@/doc/panelmenu/RouterDoc.vue';
 import PTComponent from '@/doc/panelmenu/pt/index.vue';
 import ThemingDoc from '@/doc/panelmenu/theming/index.vue';
 
diff --git a/pages/passthrough/index.vue b/pages/passthrough/index.vue
index 39d8b0087..108ec3bde 100644
--- a/pages/passthrough/index.vue
+++ b/pages/passthrough/index.vue
@@ -16,11 +16,11 @@
 </template>
 
 <script>
-import BasicDoc from '@/doc/passthrough/BasicDoc';
-import CustomCSSDoc from '@/doc/passthrough/CustomCSSDoc';
-import GlobalDoc from '@/doc/passthrough/GlobalDoc';
-import LifecycleDoc from '@/doc/passthrough/LifecycleDoc';
-import UsePassThroughDoc from '../../doc/passthrough/UsePassThroughDoc.vue';
+import BasicDoc from '@/doc/passthrough/BasicDoc.vue';
+import CustomCSSDoc from '@/doc/passthrough/CustomCSSDoc.vue';
+import GlobalDoc from '@/doc/passthrough/GlobalDoc.vue';
+import LifecycleDoc from '@/doc/passthrough/LifecycleDoc.vue';
+import UsePassThroughDoc from '@/doc/passthrough/UsePassThroughDoc.vue';
 
 export default {
     data() {
diff --git a/pages/progressbar/index.vue b/pages/progressbar/index.vue
index 14ae545a8..bb4b4f15d 100755
--- a/pages/progressbar/index.vue
+++ b/pages/progressbar/index.vue
@@ -3,12 +3,12 @@
 </template>
 
 <script>
-import AccessibilityDoc from '@/doc/progressbar/AccessibilityDoc';
-import BasicDoc from '@/doc/progressbar/BasicDoc';
-import DynamicDoc from '@/doc/progressbar/DynamicDoc';
-import ImportDoc from '@/doc/progressbar/ImportDoc';
-import IndeterminateDoc from '@/doc/progressbar/IndeterminateDoc';
-import TemplateDoc from '@/doc/progressbar/TemplateDoc';
+import AccessibilityDoc from '@/doc/progressbar/AccessibilityDoc.vue';
+import BasicDoc from '@/doc/progressbar/BasicDoc.vue';
+import DynamicDoc from '@/doc/progressbar/DynamicDoc.vue';
+import ImportDoc from '@/doc/progressbar/ImportDoc.vue';
+import IndeterminateDoc from '@/doc/progressbar/IndeterminateDoc.vue';
+import TemplateDoc from '@/doc/progressbar/TemplateDoc.vue';
 import PTComponent from '@/doc/progressbar/pt/index.vue';
 import ThemingDoc from '@/doc/progressbar/theming/index.vue';
 
diff --git a/pages/progressspinner/index.vue b/pages/progressspinner/index.vue
index f9e333857..18752bf76 100755
--- a/pages/progressspinner/index.vue
+++ b/pages/progressspinner/index.vue
@@ -3,10 +3,10 @@
 </template>
 
 <script>
-import AccessibilityDoc from '@/doc/progressspinner/AccessibilityDoc';
-import BasicDoc from '@/doc/progressspinner/BasicDoc';
-import CustomDoc from '@/doc/progressspinner/CustomDoc';
-import ImportDoc from '@/doc/progressspinner/ImportDoc';
+import AccessibilityDoc from '@/doc/progressspinner/AccessibilityDoc.vue';
+import BasicDoc from '@/doc/progressspinner/BasicDoc.vue';
+import CustomDoc from '@/doc/progressspinner/CustomDoc.vue';
+import ImportDoc from '@/doc/progressspinner/ImportDoc.vue';
 import PTComponent from '@/doc/progressspinner/pt/index.vue';
 import ThemingDoc from '@/doc/progressspinner/theming/index.vue';
 export default {
diff --git a/pages/ripple/index.vue b/pages/ripple/index.vue
index 9cce1c0a9..c704982c7 100644
--- a/pages/ripple/index.vue
+++ b/pages/ripple/index.vue
@@ -3,11 +3,11 @@
 </template>
 
 <script>
-import AccessibilityDoc from '@/doc/ripple/AccessibilityDoc';
+import AccessibilityDoc from '@/doc/ripple/AccessibilityDoc.vue';
 import ConfigurationDoc from '@/doc/ripple/ConfigurationDoc.vue';
-import CustomDoc from '@/doc/ripple/CustomDoc';
-import DefaultDoc from '@/doc/ripple/DefaultDoc';
-import ImportDoc from '@/doc/ripple/ImportDoc';
+import CustomDoc from '@/doc/ripple/CustomDoc.vue';
+import DefaultDoc from '@/doc/ripple/DefaultDoc.vue';
+import ImportDoc from '@/doc/ripple/ImportDoc.vue';
 import PTComponent from '@/doc/ripple/pt/index.vue';
 import ThemingDoc from '@/doc/ripple/theming/index.vue';
 
diff --git a/pages/scrollpanel/index.vue b/pages/scrollpanel/index.vue
index 2e5d4051d..88e5583fe 100644
--- a/pages/scrollpanel/index.vue
+++ b/pages/scrollpanel/index.vue
@@ -10,10 +10,10 @@
     />
 </template>
 <script>
-import AccessibilityDoc from '@/doc/scrollpanel/AccessibilityDoc';
-import BasicDoc from '@/doc/scrollpanel/BasicDoc';
-import CustomDoc from '@/doc/scrollpanel/CustomDoc';
-import ImportDoc from '@/doc/scrollpanel/ImportDoc';
+import AccessibilityDoc from '@/doc/scrollpanel/AccessibilityDoc.vue';
+import BasicDoc from '@/doc/scrollpanel/BasicDoc.vue';
+import CustomDoc from '@/doc/scrollpanel/CustomDoc.vue';
+import ImportDoc from '@/doc/scrollpanel/ImportDoc.vue';
 import PTComponent from '@/doc/scrollpanel/pt/index.vue';
 import ThemingDoc from '@/doc/scrollpanel/theming/index.vue';
 
diff --git a/pages/scrolltop/index.vue b/pages/scrolltop/index.vue
index 05ad9929e..0444d1ea9 100644
--- a/pages/scrolltop/index.vue
+++ b/pages/scrolltop/index.vue
@@ -11,10 +11,10 @@
 </template>
 
 <script>
-import AccessibilityDoc from '@/doc/scrolltop/AccessibilityDoc';
-import BasicDoc from '@/doc/scrolltop/BasicDoc';
-import ElementDoc from '@/doc/scrolltop/ElementDoc';
-import ImportDoc from '@/doc/scrolltop/ImportDoc';
+import AccessibilityDoc from '@/doc/scrolltop/AccessibilityDoc.vue';
+import BasicDoc from '@/doc/scrolltop/BasicDoc.vue';
+import ElementDoc from '@/doc/scrolltop/ElementDoc.vue';
+import ImportDoc from '@/doc/scrolltop/ImportDoc.vue';
 import PTComponent from '@/doc/scrolltop/pt/index.vue';
 import ThemingDoc from '@/doc/scrolltop/theming/index.vue';
 
diff --git a/pages/selectbutton/index.vue b/pages/selectbutton/index.vue
index a80953c24..1fb1fe507 100755
--- a/pages/selectbutton/index.vue
+++ b/pages/selectbutton/index.vue
@@ -11,14 +11,14 @@
 </template>
 
 <script>
-import AccessibilityDoc from '@/doc/selectbutton/AccessibilityDoc';
-import BasicDoc from '@/doc/selectbutton/BasicDoc';
-import DisabledDoc from '@/doc/selectbutton/DisabledDoc';
-import ImportDoc from '@/doc/selectbutton/ImportDoc';
-import InvalidDoc from '@/doc/selectbutton/InvalidDoc';
-import MultipleDoc from '@/doc/selectbutton/MultipleDoc';
-import TemplateDoc from '@/doc/selectbutton/TemplateDoc';
-import VeeValidateDoc from '@/doc/selectbutton/form/VeeValidateDoc';
+import AccessibilityDoc from '@/doc/selectbutton/AccessibilityDoc.vue';
+import BasicDoc from '@/doc/selectbutton/BasicDoc.vue';
+import DisabledDoc from '@/doc/selectbutton/DisabledDoc.vue';
+import ImportDoc from '@/doc/selectbutton/ImportDoc.vue';
+import InvalidDoc from '@/doc/selectbutton/InvalidDoc.vue';
+import MultipleDoc from '@/doc/selectbutton/MultipleDoc.vue';
+import TemplateDoc from '@/doc/selectbutton/TemplateDoc.vue';
+import VeeValidateDoc from '@/doc/selectbutton/form/VeeValidateDoc.vue';
 import PTComponent from '@/doc/selectbutton/pt/index.vue';
 import ThemingDoc from '@/doc/selectbutton/theming/index.vue';
 
diff --git a/pages/sidebar/index.vue b/pages/sidebar/index.vue
index d736da67d..4ec48185f 100755
--- a/pages/sidebar/index.vue
+++ b/pages/sidebar/index.vue
@@ -11,13 +11,13 @@
 </template>
 
 <script>
-import AccessibilityDoc from '@/doc/sidebar/AccessibilityDoc';
-import BasicDoc from '@/doc/sidebar/BasicDoc';
-import FullScreenDoc from '@/doc/sidebar/FullScreenDoc';
-import ImportDoc from '@/doc/sidebar/ImportDoc';
-import PositionDoc from '@/doc/sidebar/PositionDoc';
-import SizeDoc from '@/doc/sidebar/SizeDoc';
-import TemplateDoc from '@/doc/sidebar/TemplateDoc';
+import AccessibilityDoc from '@/doc/sidebar/AccessibilityDoc.vue';
+import BasicDoc from '@/doc/sidebar/BasicDoc.vue';
+import FullScreenDoc from '@/doc/sidebar/FullScreenDoc.vue';
+import ImportDoc from '@/doc/sidebar/ImportDoc.vue';
+import PositionDoc from '@/doc/sidebar/PositionDoc.vue';
+import SizeDoc from '@/doc/sidebar/SizeDoc.vue';
+import TemplateDoc from '@/doc/sidebar/TemplateDoc.vue';
 import PTComponent from '@/doc/sidebar/pt/index.vue';
 import ThemingDoc from '@/doc/sidebar/theming/index.vue';
 
diff --git a/pages/slider/index.vue b/pages/slider/index.vue
index b184d423c..cdeded205 100755
--- a/pages/slider/index.vue
+++ b/pages/slider/index.vue
@@ -3,13 +3,13 @@
 </template>
 
 <script>
-import AccessibilityDoc from '@/doc/slider/AccessibilityDoc';
-import BasicDoc from '@/doc/slider/BasicDoc';
-import ImportDoc from '@/doc/slider/ImportDoc';
-import InputDoc from '@/doc/slider/InputDoc';
-import RangeDoc from '@/doc/slider/RangeDoc';
-import StepDoc from '@/doc/slider/StepDoc';
-import VerticalDoc from '@/doc/slider/VerticalDoc';
+import AccessibilityDoc from '@/doc/slider/AccessibilityDoc.vue';
+import BasicDoc from '@/doc/slider/BasicDoc.vue';
+import ImportDoc from '@/doc/slider/ImportDoc.vue';
+import InputDoc from '@/doc/slider/InputDoc.vue';
+import RangeDoc from '@/doc/slider/RangeDoc.vue';
+import StepDoc from '@/doc/slider/StepDoc.vue';
+import VerticalDoc from '@/doc/slider/VerticalDoc.vue';
 import PTComponent from '@/doc/slider/pt/index.vue';
 import ThemingDoc from '@/doc/slider/theming/index.vue';
 
diff --git a/pages/splitter/index.vue b/pages/splitter/index.vue
index a8f7666e2..17630c7d6 100644
--- a/pages/splitter/index.vue
+++ b/pages/splitter/index.vue
@@ -11,9 +11,9 @@
 </template>
 
 <script>
-import AccessibilityDoc from '@/doc/splitter/AccessibilityDoc';
+import AccessibilityDoc from '@/doc/splitter/AccessibilityDoc.vue';
 import HorizontalDoc from '@/doc/splitter/HorizontalDoc.vue';
-import ImportDoc from '@/doc/splitter/ImportDoc';
+import ImportDoc from '@/doc/splitter/ImportDoc.vue';
 import NestedDoc from '@/doc/splitter/NestedDoc.vue';
 import SizeDoc from '@/doc/splitter/SizeDoc.vue';
 import VerticalDoc from '@/doc/splitter/VerticalDoc.vue';
diff --git a/pages/steps.vue b/pages/steps.vue
index 63547de31..ceef7382b 100755
--- a/pages/steps.vue
+++ b/pages/steps.vue
@@ -11,11 +11,11 @@
 </template>
 
 <script>
-import AccessibilityDoc from '@/doc/steps/AccessibilityDoc';
-import BasicDoc from '@/doc/steps/BasicDoc';
-import ImportDoc from '@/doc/steps/ImportDoc';
-import InteractiveDoc from '@/doc/steps/InteractiveDoc';
-import RouterDoc from '@/doc/steps/RouterDoc';
+import AccessibilityDoc from '@/doc/steps/AccessibilityDoc.vue';
+import BasicDoc from '@/doc/steps/BasicDoc.vue';
+import ImportDoc from '@/doc/steps/ImportDoc.vue';
+import InteractiveDoc from '@/doc/steps/InteractiveDoc.vue';
+import RouterDoc from '@/doc/steps/RouterDoc.vue';
 import PTComponent from '@/doc/steps/pt/index.vue';
 import ThemingDoc from '@/doc/steps/theming/index.vue';
 
diff --git a/pages/styleclass/index.vue b/pages/styleclass/index.vue
index a48742a00..718464f9e 100644
--- a/pages/styleclass/index.vue
+++ b/pages/styleclass/index.vue
@@ -9,9 +9,9 @@
 </template>
 
 <script>
-import AnimationDoc from '@/doc/styleclass/AnimationDoc';
-import ImportDoc from '@/doc/styleclass/ImportDoc';
-import ToggleClass from '@/doc/styleclass/ToggleClassDoc';
+import AnimationDoc from '@/doc/styleclass/AnimationDoc.vue';
+import ImportDoc from '@/doc/styleclass/ImportDoc.vue';
+import ToggleClass from '@/doc/styleclass/ToggleClassDoc.vue';
 
 export default {
     data() {
diff --git a/pages/tag/index.vue b/pages/tag/index.vue
index 990efd615..adf212261 100644
--- a/pages/tag/index.vue
+++ b/pages/tag/index.vue
@@ -3,13 +3,13 @@
 </template>
 
 <script>
-import AccessibilityDoc from '@/doc/tag/AccessibilityDoc';
-import BasicDoc from '@/doc/tag/BasicDoc';
-import IconDoc from '@/doc/tag/IconDoc';
-import ImportDoc from '@/doc/tag/ImportDoc';
-import PillDoc from '@/doc/tag/PillDoc';
-import SeverityDoc from '@/doc/tag/SeverityDoc';
-import TemplateDoc from '@/doc/tag/TemplateDoc';
+import AccessibilityDoc from '@/doc/tag/AccessibilityDoc.vue';
+import BasicDoc from '@/doc/tag/BasicDoc.vue';
+import IconDoc from '@/doc/tag/IconDoc.vue';
+import ImportDoc from '@/doc/tag/ImportDoc.vue';
+import PillDoc from '@/doc/tag/PillDoc.vue';
+import SeverityDoc from '@/doc/tag/SeverityDoc.vue';
+import TemplateDoc from '@/doc/tag/TemplateDoc.vue';
 import PTComponent from '@/doc/tag/pt/index.vue';
 import ThemingDoc from '@/doc/tag/theming/index.vue';
 
diff --git a/pages/tailwind/index.vue b/pages/tailwind/index.vue
index dd43ec3d4..02782a39d 100644
--- a/pages/tailwind/index.vue
+++ b/pages/tailwind/index.vue
@@ -24,8 +24,8 @@
 
 <script>
 import CustomizationDoc from '@/doc/tailwind/CustomizationDoc.vue';
-import ExampleDoc from '@/doc/tailwind/ExampleDoc';
-import SetupDoc from '@/doc/tailwind/SetupDoc';
+import ExampleDoc from '@/doc/tailwind/ExampleDoc.vue';
+import SetupDoc from '@/doc/tailwind/SetupDoc.vue';
 
 export default {
     data() {
diff --git a/pages/terminal/index.vue b/pages/terminal/index.vue
index 160d213ea..62f676508 100755
--- a/pages/terminal/index.vue
+++ b/pages/terminal/index.vue
@@ -3,9 +3,9 @@
 </template>
 
 <script>
-import AccessibilityDoc from '@/doc/terminal/AccessibilityDoc';
-import BasicDoc from '@/doc/terminal/BasicDoc';
-import ImportDoc from '@/doc/terminal/ImportDoc';
+import AccessibilityDoc from '@/doc/terminal/AccessibilityDoc.vue';
+import BasicDoc from '@/doc/terminal/BasicDoc.vue';
+import ImportDoc from '@/doc/terminal/ImportDoc.vue';
 import PTComponent from '@/doc/terminal/pt/index.vue';
 import ThemingDoc from '@/doc/terminal/theming/index.vue';
 
diff --git a/pages/textarea/index.vue b/pages/textarea/index.vue
index aab4bce68..666c8daad 100755
--- a/pages/textarea/index.vue
+++ b/pages/textarea/index.vue
@@ -11,13 +11,13 @@
 </template>
 
 <script>
-import AccessibilityDoc from '@/doc/textarea/AccessibilityDoc';
-import AutoResizeDoc from '@/doc/textarea/AutoResizeDoc';
-import BasicDoc from '@/doc/textarea/BasicDoc';
-import DisabledDoc from '@/doc/textarea/DisabledDoc';
-import FloatLabelDoc from '@/doc/textarea/FloatLabelDoc';
-import ImportDoc from '@/doc/textarea/ImportDoc';
-import InvalidDoc from '@/doc/textarea/InvalidDoc';
+import AccessibilityDoc from '@/doc/textarea/AccessibilityDoc.vue';
+import AutoResizeDoc from '@/doc/textarea/AutoResizeDoc.vue';
+import BasicDoc from '@/doc/textarea/BasicDoc.vue';
+import DisabledDoc from '@/doc/textarea/DisabledDoc.vue';
+import FloatLabelDoc from '@/doc/textarea/FloatLabelDoc.vue';
+import ImportDoc from '@/doc/textarea/ImportDoc.vue';
+import InvalidDoc from '@/doc/textarea/InvalidDoc.vue';
 import VeeValidateDoc from '@/doc/textarea/form/VeeValidateDoc.vue';
 import PTComponent from '@/doc/textarea/pt/index.vue';
 import ThemingDoc from '@/doc/textarea/theming/index.vue';
diff --git a/pages/theming/index.vue b/pages/theming/index.vue
index 3ca100634..0c03d8c0b 100755
--- a/pages/theming/index.vue
+++ b/pages/theming/index.vue
@@ -19,16 +19,16 @@
 </template>
 
 <script>
-import ArchitectureDoc from '@/doc/theming/ArchitectureDoc';
-import BuiltInThemesDoc from '@/doc/theming/BuiltInThemesDoc';
-import CSSModulesDoc from '@/doc/theming/CSSModulesDoc';
-import CustomThemeDoc from '@/doc/theming/CustomThemeDoc';
-import PrimeFlexDoc from '@/doc/theming/PrimeFlexDoc';
-import ScaleDoc from '@/doc/theming/ScaleDoc';
-import ScopedCSSDoc from '@/doc/theming/ScopedCSSDoc';
-import UtilsDoc from '@/doc/theming/UtilsDoc';
-import CSSVariablesDoc from '../../doc/theming/CSSVariablesDoc';
-import SwitchThemesDoc from '../../doc/theming/SwitchThemesDoc';
+import ArchitectureDoc from '@/doc/theming/ArchitectureDoc.vue';
+import BuiltInThemesDoc from '@/doc/theming/BuiltInThemesDoc.vue';
+import CSSModulesDoc from '@/doc/theming/CSSModulesDoc.vue';
+import CSSVariablesDoc from '@/doc/theming/CSSVariablesDoc.vue';
+import CustomThemeDoc from '@/doc/theming/CustomThemeDoc.vue';
+import PrimeFlexDoc from '@/doc/theming/PrimeFlexDoc.vue';
+import ScaleDoc from '@/doc/theming/ScaleDoc.vue';
+import ScopedCSSDoc from '@/doc/theming/ScopedCSSDoc.vue';
+import SwitchThemesDoc from '@/doc/theming/SwitchThemesDoc.vue';
+import UtilsDoc from '@/doc/theming/UtilsDoc.vue';
 
 export default {
     data() {
diff --git a/pages/tieredmenu/index.vue b/pages/tieredmenu/index.vue
index b0617cf6b..1260e69c9 100755
--- a/pages/tieredmenu/index.vue
+++ b/pages/tieredmenu/index.vue
@@ -11,11 +11,11 @@
 </template>
 
 <script>
-import AccessibilityDoc from '@/doc/tieredmenu/AccessibilityDoc';
-import BasicDoc from '@/doc/tieredmenu/BasicDoc';
-import ImportDoc from '@/doc/tieredmenu/ImportDoc';
-import PopupDoc from '@/doc/tieredmenu/PopupDoc';
-import RouterDoc from '@/doc/tieredmenu/RouterDoc';
+import AccessibilityDoc from '@/doc/tieredmenu/AccessibilityDoc.vue';
+import BasicDoc from '@/doc/tieredmenu/BasicDoc.vue';
+import ImportDoc from '@/doc/tieredmenu/ImportDoc.vue';
+import PopupDoc from '@/doc/tieredmenu/PopupDoc.vue';
+import RouterDoc from '@/doc/tieredmenu/RouterDoc.vue';
 import PTComponent from '@/doc/tieredmenu/pt/index.vue';
 import ThemingDoc from '@/doc/tieredmenu/theming/index.vue';
 
diff --git a/pages/timeline/index.vue b/pages/timeline/index.vue
index 529e5d346..1d59e18b4 100644
--- a/pages/timeline/index.vue
+++ b/pages/timeline/index.vue
@@ -3,13 +3,13 @@
 </template>
 
 <script>
-import AccessibilityDoc from '@/doc/timeline/AccessibilityDoc';
-import AlignmentDoc from '@/doc/timeline/AlignmentDoc';
-import BasicDoc from '@/doc/timeline/BasicDoc';
-import HorizontalDoc from '@/doc/timeline/HorizontalDoc';
-import ImportDoc from '@/doc/timeline/ImportDoc';
-import OppositeDoc from '@/doc/timeline/OppositeDoc';
-import TemplateDoc from '@/doc/timeline/TemplateDoc';
+import AccessibilityDoc from '@/doc/timeline/AccessibilityDoc.vue';
+import AlignmentDoc from '@/doc/timeline/AlignmentDoc.vue';
+import BasicDoc from '@/doc/timeline/BasicDoc.vue';
+import HorizontalDoc from '@/doc/timeline/HorizontalDoc.vue';
+import ImportDoc from '@/doc/timeline/ImportDoc.vue';
+import OppositeDoc from '@/doc/timeline/OppositeDoc.vue';
+import TemplateDoc from '@/doc/timeline/TemplateDoc.vue';
 import PTComponent from '@/doc/timeline/pt/index.vue';
 import ThemingDoc from '@/doc/timeline/theming/index.vue';
 
diff --git a/pages/toolbar/index.vue b/pages/toolbar/index.vue
index 8041bf8b3..18f1370a7 100755
--- a/pages/toolbar/index.vue
+++ b/pages/toolbar/index.vue
@@ -2,9 +2,9 @@
     <DocComponent title="Vue Toolbar Component" header="Toolbar" description="Toolbar is a grouping component for buttons and other content." :componentDocs="docs" :apiDocs="['Toolbar']" :ptTabComponent="ptComponent" :themingDocs="themingDoc" />
 </template>
 <script>
-import AccessibilityDoc from '@/doc/toolbar/AccessibilityDoc';
-import BasicDoc from '@/doc/toolbar/BasicDoc';
-import ImportDoc from '@/doc/toolbar/ImportDoc';
+import AccessibilityDoc from '@/doc/toolbar/AccessibilityDoc.vue';
+import BasicDoc from '@/doc/toolbar/BasicDoc.vue';
+import ImportDoc from '@/doc/toolbar/ImportDoc.vue';
 import PTComponent from '@/doc/toolbar/pt/index.vue';
 import ThemingDoc from '@/doc/toolbar/theming/index.vue';
 
diff --git a/pages/tooltip/index.vue b/pages/tooltip/index.vue
index c661cb13f..e6b425e2d 100755
--- a/pages/tooltip/index.vue
+++ b/pages/tooltip/index.vue
@@ -3,12 +3,12 @@
 </template>
 
 <script>
-import AccessibilityDoc from '@/doc/tooltip/AccessibilityDoc';
-import DelayDoc from '@/doc/tooltip/DelayDoc';
-import EventDoc from '@/doc/tooltip/EventDoc';
-import ImportDoc from '@/doc/tooltip/ImportDoc';
-import PositionDoc from '@/doc/tooltip/PositionDoc';
-import TemplateDoc from '@/doc/tooltip/TemplateDoc';
+import AccessibilityDoc from '@/doc/tooltip/AccessibilityDoc.vue';
+import DelayDoc from '@/doc/tooltip/DelayDoc.vue';
+import EventDoc from '@/doc/tooltip/EventDoc.vue';
+import ImportDoc from '@/doc/tooltip/ImportDoc.vue';
+import PositionDoc from '@/doc/tooltip/PositionDoc.vue';
+import TemplateDoc from '@/doc/tooltip/TemplateDoc.vue';
 import PTComponent from '@/doc/tooltip/pt/index.vue';
 import ThemingDoc from '@/doc/tooltip/theming/index.vue';
 
diff --git a/pages/treeselect/index.vue b/pages/treeselect/index.vue
index 28e380743..933f7986e 100644
--- a/pages/treeselect/index.vue
+++ b/pages/treeselect/index.vue
@@ -11,14 +11,14 @@
 </template>
 
 <script>
-import AccessibilityDoc from '@/doc/treeselect/AccessibilityDoc';
-import BasicDoc from '@/doc/treeselect/BasicDoc';
-import CheckboxDoc from '@/doc/treeselect/CheckboxDoc';
-import DisabledDoc from '@/doc/treeselect/DisabledDoc';
-import FloatLabelDoc from '@/doc/treeselect/FloatLabelDoc';
-import ImportDoc from '@/doc/treeselect/ImportDoc';
-import InvalidDoc from '@/doc/treeselect/InvalidDoc';
-import MultipleDoc from '@/doc/treeselect/MultipleDoc';
+import AccessibilityDoc from '@/doc/treeselect/AccessibilityDoc.vue';
+import BasicDoc from '@/doc/treeselect/BasicDoc.vue';
+import CheckboxDoc from '@/doc/treeselect/CheckboxDoc.vue';
+import DisabledDoc from '@/doc/treeselect/DisabledDoc.vue';
+import FloatLabelDoc from '@/doc/treeselect/FloatLabelDoc.vue';
+import ImportDoc from '@/doc/treeselect/ImportDoc.vue';
+import InvalidDoc from '@/doc/treeselect/InvalidDoc.vue';
+import MultipleDoc from '@/doc/treeselect/MultipleDoc.vue';
 import VeeValidateDoc from '@/doc/treeselect/form/VeeValidateDoc.vue';
 import PTComponent from '@/doc/treeselect/pt/index.vue';
 import ThemingDoc from '@/doc/treeselect/theming/index.vue';
diff --git a/pages/treetable/index.vue b/pages/treetable/index.vue
index 79178eb96..e9f8edb91 100755
--- a/pages/treetable/index.vue
+++ b/pages/treetable/index.vue
@@ -11,33 +11,33 @@
 </template>
 
 <script>
-import AccessibilityDoc from '@/doc/treetable/AccessibilityDoc';
-import BasicDoc from '@/doc/treetable/BasicDoc';
-import ColumnToggleDoc from '@/doc/treetable/ColumnToggleDoc';
-import ControlledDoc from '@/doc/treetable/ControlledDoc';
-import DynamicColumnsDoc from '@/doc/treetable/DynamicColumnsDoc';
-import FilterDoc from '@/doc/treetable/FilterDoc';
-import ImportDoc from '@/doc/treetable/ImportDoc';
-import LazyLoadDoc from '@/doc/treetable/LazyLoadDoc';
-import ResponsiveDoc from '@/doc/treetable/ResponsiveDoc';
-import SizeDoc from '@/doc/treetable/SizeDoc';
-import TemplateDoc from '@/doc/treetable/TemplateDoc';
-import PaginatorBasicDoc from '@/doc/treetable/paginator/PaginatorBasicDoc';
-import PaginatorTemplateDoc from '@/doc/treetable/paginator/PaginatorTemplateDoc';
+import AccessibilityDoc from '@/doc/treetable/AccessibilityDoc.vue';
+import BasicDoc from '@/doc/treetable/BasicDoc.vue';
+import ColumnToggleDoc from '@/doc/treetable/ColumnToggleDoc.vue';
+import ControlledDoc from '@/doc/treetable/ControlledDoc.vue';
+import DynamicColumnsDoc from '@/doc/treetable/DynamicColumnsDoc.vue';
+import FilterDoc from '@/doc/treetable/FilterDoc.vue';
+import ImportDoc from '@/doc/treetable/ImportDoc.vue';
+import LazyLoadDoc from '@/doc/treetable/LazyLoadDoc.vue';
+import ResponsiveDoc from '@/doc/treetable/ResponsiveDoc.vue';
+import SizeDoc from '@/doc/treetable/SizeDoc.vue';
+import TemplateDoc from '@/doc/treetable/TemplateDoc.vue';
+import PaginatorBasicDoc from '@/doc/treetable/paginator/PaginatorBasicDoc.vue';
+import PaginatorTemplateDoc from '@/doc/treetable/paginator/PaginatorTemplateDoc.vue';
 import PTComponent from '@/doc/treetable/pt/index.vue';
-import ExpandModeDoc from '@/doc/treetable/resize/ExpandModeDoc';
-import FitModeDoc from '@/doc/treetable/resize/FitModeDoc';
-import FlexibleScrollDoc from '@/doc/treetable/scroll/FlexibleScrollDoc';
-import FrozenColumnsDoc from '@/doc/treetable/scroll/FrozenColumnsDoc';
-import HorizontalScrollDoc from '@/doc/treetable/scroll/HorizontalScrollDoc';
-import VerticalScrollDoc from '@/doc/treetable/scroll/VerticalScrollDoc';
-import CheckboxRowSelectionDoc from '@/doc/treetable/selection/CheckboxRowSelectionDoc';
-import MultipleRowsSelectionDoc from '@/doc/treetable/selection/MultipleRowsSelectionDoc';
-import RowSelectionEventsDoc from '@/doc/treetable/selection/RowSelectionEventsDoc';
-import SingleRowSelectionDoc from '@/doc/treetable/selection/SingleRowSelectionDoc';
-import MultipleColumnsDoc from '@/doc/treetable/sort/MultipleColumnsDoc';
-import RemovableSortDoc from '@/doc/treetable/sort/RemovableSortDoc';
-import SingleColumnDoc from '@/doc/treetable/sort/SingleColumnDoc';
+import ExpandModeDoc from '@/doc/treetable/resize/ExpandModeDoc.vue';
+import FitModeDoc from '@/doc/treetable/resize/FitModeDoc.vue';
+import FlexibleScrollDoc from '@/doc/treetable/scroll/FlexibleScrollDoc.vue';
+import FrozenColumnsDoc from '@/doc/treetable/scroll/FrozenColumnsDoc.vue';
+import HorizontalScrollDoc from '@/doc/treetable/scroll/HorizontalScrollDoc.vue';
+import VerticalScrollDoc from '@/doc/treetable/scroll/VerticalScrollDoc.vue';
+import CheckboxRowSelectionDoc from '@/doc/treetable/selection/CheckboxRowSelectionDoc.vue';
+import MultipleRowsSelectionDoc from '@/doc/treetable/selection/MultipleRowsSelectionDoc.vue';
+import RowSelectionEventsDoc from '@/doc/treetable/selection/RowSelectionEventsDoc.vue';
+import SingleRowSelectionDoc from '@/doc/treetable/selection/SingleRowSelectionDoc.vue';
+import MultipleColumnsDoc from '@/doc/treetable/sort/MultipleColumnsDoc.vue';
+import RemovableSortDoc from '@/doc/treetable/sort/RemovableSortDoc.vue';
+import SingleColumnDoc from '@/doc/treetable/sort/SingleColumnDoc.vue';
 import ThemingDoc from '@/doc/treetable/theming/index.vue';
 
 export default {
diff --git a/pages/tristatecheckbox/index.vue b/pages/tristatecheckbox/index.vue
index a6dda863d..a3aa4f1b0 100755
--- a/pages/tristatecheckbox/index.vue
+++ b/pages/tristatecheckbox/index.vue
@@ -11,11 +11,11 @@
 </template>
 
 <script>
-import AccessibilityDoc from '@/doc/tristatecheckbox/AccessibilityDoc';
-import BasicDoc from '@/doc/tristatecheckbox/BasicDoc';
-import DisabledDoc from '@/doc/tristatecheckbox/DisabledDoc';
-import ImportDoc from '@/doc/tristatecheckbox/ImportDoc';
-import InvalidDoc from '@/doc/tristatecheckbox/InvalidDoc';
+import AccessibilityDoc from '@/doc/tristatecheckbox/AccessibilityDoc.vue';
+import BasicDoc from '@/doc/tristatecheckbox/BasicDoc.vue';
+import DisabledDoc from '@/doc/tristatecheckbox/DisabledDoc.vue';
+import ImportDoc from '@/doc/tristatecheckbox/ImportDoc.vue';
+import InvalidDoc from '@/doc/tristatecheckbox/InvalidDoc.vue';
 import VeeValidateDoc from '@/doc/tristatecheckbox/form/VeeValidateDoc.vue';
 import PTComponent from '@/doc/tristatecheckbox/pt/index.vue';
 import ThemingDoc from '@/doc/tristatecheckbox/theming/index.vue';
diff --git a/pages/unocss/index.vue b/pages/unocss/index.vue
index 0857f2381..07f47b78f 100644
--- a/pages/unocss/index.vue
+++ b/pages/unocss/index.vue
@@ -22,8 +22,8 @@
 </template>
 
 <script>
-import ExampleDoc from '@/doc/unocss/ExampleDoc';
-import SetupDoc from '@/doc/unocss/SetupDoc';
+import ExampleDoc from '@/doc/unocss/ExampleDoc.vue';
+import SetupDoc from '@/doc/unocss/SetupDoc.vue';
 
 export default {
     data() {
diff --git a/pages/unstyled/index.vue b/pages/unstyled/index.vue
index c223adea4..36bdc339f 100644
--- a/pages/unstyled/index.vue
+++ b/pages/unstyled/index.vue
@@ -19,10 +19,10 @@
 </template>
 
 <script>
-import ArchitectureDoc from '@/doc/unstyled/ArchitectureDoc';
-import ExampleDoc from '@/doc/unstyled/ExampleDoc';
-import SetupDoc from '@/doc/unstyled/SetupDoc';
-import ThemeDoc from '@/doc/unstyled/ThemeDoc';
+import ArchitectureDoc from '@/doc/unstyled/ArchitectureDoc.vue';
+import ExampleDoc from '@/doc/unstyled/ExampleDoc.vue';
+import SetupDoc from '@/doc/unstyled/SetupDoc.vue';
+import ThemeDoc from '@/doc/unstyled/ThemeDoc.vue';
 
 export default {
     data() {
diff --git a/pages/virtualscroller/index.vue b/pages/virtualscroller/index.vue
index 729f5e14e..bca1e2675 100644
--- a/pages/virtualscroller/index.vue
+++ b/pages/virtualscroller/index.vue
@@ -11,14 +11,14 @@
 </template>
 
 <script>
-import AccessibilityDoc from '@/doc/virtualscroller/AccessibilityDoc';
-import BasicDoc from '@/doc/virtualscroller/BasicDoc';
-import DelayDoc from '@/doc/virtualscroller/DelayDoc';
-import GridDoc from '@/doc/virtualscroller/GridDoc';
-import HorizontalDoc from '@/doc/virtualscroller/HorizontalDoc';
-import ImportDoc from '@/doc/virtualscroller/ImportDoc';
-import LazyDoc from '@/doc/virtualscroller/LazyDoc';
-import LoadingDoc from '@/doc/virtualscroller/LoadingDoc';
+import AccessibilityDoc from '@/doc/virtualscroller/AccessibilityDoc.vue';
+import BasicDoc from '@/doc/virtualscroller/BasicDoc.vue';
+import DelayDoc from '@/doc/virtualscroller/DelayDoc.vue';
+import GridDoc from '@/doc/virtualscroller/GridDoc.vue';
+import HorizontalDoc from '@/doc/virtualscroller/HorizontalDoc.vue';
+import ImportDoc from '@/doc/virtualscroller/ImportDoc.vue';
+import LazyDoc from '@/doc/virtualscroller/LazyDoc.vue';
+import LoadingDoc from '@/doc/virtualscroller/LoadingDoc.vue';
 import PTComponent from '@/doc/virtualscroller/pt/index.vue';
 import ThemingDoc from '@/doc/virtualscroller/theming/index.vue';