-
-
Notifications
You must be signed in to change notification settings - Fork 45
Description
I have to define all subfolders one by one for component render when using atomic design. I do not want to do that. Is there any way to fix it?
It's working
/*
** Components config.
*/
components: [
'~/components/atoms/badge',
'~/components/atoms/button',
'~/components/atoms/heading',
'~/components/molecules/button-group',
'~/components/molecules/link-group',
...
],
Not working
/*
** Components config.
*/
components: [
'~/components/atoms',
'~/components/molecules',
'~/components/organisms',
'~/components/templates',
'~/components/xelements',
],
Nuxt: 2.15.2
My component dir full structure
📦components
┣ 📂atoms
┃ ┣ 📂badge
┃ ┃ ┣ 📂a-badge
┃ ┃ ┃ ┗ 📜index.vue
┃ ┃ ┣ 📂a-category-block-link-badge
┃ ┃ ┃ ┗ 📜index.vue
┃ ┃ ┗ 📂a-category-tag-link-badge
┃ ┃ ┃ ┗ 📜index.vue
┃ ┣ 📂button
┃ ┃ ┣ 📂a-app-lang-switcher-btn
┃ ┃ ┃ ┗ 📜index.vue
┃ ┃ ┣ 📂a-block-nav-button
┃ ┃ ┃ ┗ 📜index.vue
┃ ┃ ┣ 📂a-paper-btn
┃ ┃ ┃ ┗ 📜index.vue
┃ ┃ ┣ 📂a-question-card-action-btn
┃ ┃ ┃ ┗ 📜index.vue
┃ ┃ ┗ 📂a-vote-btn
┃ ┃ ┃ ┗ 📜index.vue
┃ ┣ 📂heading
┃ ┃ ┗ 📂a-heading
┃ ┃ ┃ ┗ 📜index.vue
┃ ┣ 📂image
┃ ┃ ┗ 📂a-avatar
┃ ┃ ┃ ┗ 📜index.vue
┃ ┣ 📂input
┃ ┃ ┣ 📂a-category-select-input
┃ ┃ ┃ ┗ 📜index.vue
┃ ┃ ┗ 📂a-question-search-input
┃ ┃ ┃ ┗ 📜index.vue
┃ ┣ 📂label
┃ ┃ ┣ 📂a-post-date
┃ ┃ ┃ ┗ 📜index.vue
┃ ┃ ┗ 📂a-vote-score
┃ ┃ ┃ ┗ 📜index.vue
┃ ┣ 📂link
┃ ┃ ┣ 📂a-block-footer-link
┃ ┃ ┃ ┗ 📜index.vue
┃ ┃ ┣ 📂a-form-helper-link
┃ ┃ ┃ ┗ 📜index.vue
┃ ┃ ┗ 📂a-question-filter-nav-link
┃ ┃ ┃ ┗ 📜index.vue
┃ ┣ 📂logo
┃ ┃ ┗ 📂a-sc-logo
┃ ┃ ┃ ┗ 📜index.vue
┃ ┣ 📂meta
┃ ┃ ┗ 📂a-question-card-answer-meta
┃ ┃ ┃ ┗ 📜index.vue
┃ ┣ 📂paragraph
┃ ┃ ┗ 📂a-paragraph
┃ ┃ ┃ ┗ 📜index.vue
┃ ┣ 📂textarea
┃ ┃ ┗ 📂a-app-editor
┃ ┃ ┃ ┗ 📜index.vue
┃ ┗ 📂title
┃ ┃ ┗ 📂a-card-title
┃ ┃ ┃ ┗ 📜index.vue
┣ 📂molecules
┃ ┣ 📂answer
┃ ┃ ┣ 📂m-answer-content
┃ ┃ ┃ ┗ 📜index.vue
┃ ┃ ┗ 📂m-answer-vote
┃ ┃ ┃ ┗ 📜index.vue
┃ ┣ 📂band
┃ ┃ ┗ 📂m-page-head-band
┃ ┃ ┃ ┗ 📜index.vue
┃ ┣ 📂block
┃ ┃ ┗ 📂m-category-list-item-block
┃ ┃ ┃ ┗ 📜index.vue
┃ ┣ 📂button-group
┃ ┃ ┣ 📂m-profile-post-list-switcher-btn-group
┃ ┃ ┃ ┗ 📜index.vue
┃ ┃ ┗ 📂m-question-card-actions-btn-group
┃ ┃ ┃ ┗ 📜index.vue
┃ ┣ 📂card
┃ ┃ ┣ 📂content
┃ ┃ ┃ ┗ 📂m-question-card-content
┃ ┃ ┃ ┃ ┗ 📜index.vue
┃ ┃ ┣ 📂footer
┃ ┃ ┃ ┗ 📂m-question-card-footer
┃ ┃ ┃ ┃ ┗ 📜index.vue
┃ ┃ ┗ 📂header
┃ ┃ ┃ ┗ 📂m-question-card-header
┃ ┃ ┃ ┃ ┗ 📜index.vue
┃ ┣ 📂link-group
┃ ┃ ┣ 📂m-categories-block-link-group
┃ ┃ ┃ ┗ 📜index.vue
┃ ┃ ┣ 📂m-question-card-categories-link-group
┃ ┃ ┃ ┗ 📜index.vue
┃ ┃ ┗ 📂m-question-filter-nav-link-group
┃ ┃ ┃ ┗ 📜index.vue
┃ ┣ 📂list
┃ ┃ ┣ 📂m-profile-dropdown-list
┃ ┃ ┃ ┗ 📜index.vue
┃ ┃ ┗ 📂m-profile-stat-list
┃ ┃ ┃ ┗ 📜index.vue
┃ ┣ 📂meta
┃ ┃ ┗ 📂m-question-card-user-meta
┃ ┃ ┃ ┗ 📜index.vue
┃ ┣ 📂nav
┃ ┃ ┣ 📂m-notifications-nav
┃ ┃ ┃ ┗ 📜index.vue
┃ ┃ ┗ 📂m-settings-nav
┃ ┃ ┃ ┗ 📜index.vue
┃ ┗ 📂tabbar
┃ ┃ ┗ 📂m-app-tabbar
┃ ┃ ┃ ┗ 📜index.vue
┣ 📂organisms
┃ ┣ 📂answer
┃ ┃ ┗ 📂o-question-answer
┃ ┃ ┃ ┗ 📜index.vue
┃ ┣ 📂bar
┃ ┃ ┗ 📂o-question-filter-nav-bar
┃ ┃ ┃ ┗ 📜index.vue
┃ ┣ 📂block
┃ ┃ ┗ 📂o-categories-block
┃ ┃ ┃ ┗ 📜index.vue
┃ ┣ 📂card
┃ ┃ ┣ 📂notification
┃ ┃ ┃ ┣ 📂o-answer-notification-card
┃ ┃ ┃ ┃ ┗ 📜index.vue
┃ ┃ ┃ ┣ 📂o-solved-notification-card
┃ ┃ ┃ ┃ ┗ 📜index.vue
┃ ┃ ┃ ┣ 📂o-vote-negative-notification-card
┃ ┃ ┃ ┃ ┗ 📜index.vue
┃ ┃ ┃ ┗ 📂o-vote-positive-notification-card
┃ ┃ ┃ ┃ ┗ 📜index.vue
┃ ┃ ┗ 📂o-question-card
┃ ┃ ┃ ┗ 📜index.vue
┃ ┣ 📂content
┃ ┃ ┗ 📂o-question-detail-content
┃ ┃ ┃ ┗ 📜index.vue
┃ ┣ 📂form
┃ ┃ ┣ 📂auth
┃ ┃ ┃ ┣ 📂o-login-form
┃ ┃ ┃ ┃ ┗ 📜index.vue
┃ ┃ ┃ ┣ 📂o-register-form
┃ ┃ ┃ ┃ ┗ 📜index.vue
┃ ┃ ┃ ┗ 📂o-reset-password-form
┃ ┃ ┃ ┃ ┗ 📜index.vue
┃ ┃ ┣ 📂question
┃ ┃ ┃ ┣ 📂o-answer-form
┃ ┃ ┃ ┃ ┗ 📜index.vue
┃ ┃ ┃ ┗ 📂o-ask-form
┃ ┃ ┃ ┃ ┗ 📜index.vue
┃ ┃ ┣ 📂report
┃ ┃ ┃ ┣ 📂o-report-problem-form
┃ ┃ ┃ ┃ ┗ 📜index.vue
┃ ┃ ┃ ┗ 📂o-report-user-form
┃ ┃ ┃ ┃ ┗ 📜index.vue
┃ ┃ ┗ 📂settings
┃ ┃ ┃ ┣ 📂o-account-settings-form
┃ ┃ ┃ ┃ ┗ 📜index.vue
┃ ┃ ┃ ┗ 📂o-profile-settings-form
┃ ┃ ┃ ┃ ┗ 📜index.vue
┃ ┣ 📂head
┃ ┃ ┣ 📂o-profile-head
┃ ┃ ┃ ┗ 📜index.vue
┃ ┃ ┗ 📂o-question-detail-head
┃ ┃ ┃ ┗ 📜index.vue
┃ ┣ 📂header
┃ ┃ ┗ 📂o-app-header
┃ ┃ ┃ ┗ 📜index.vue
┃ ┗ 📂loader
┃ ┃ ┗ 📂o-app-preloader
┃ ┃ ┃ ┗ 📜index.vue
┣ 📂templates
┃ ┣ 📂answer
┃ ┃ ┗ 📂t-question-answers
┃ ┃ ┃ ┗ 📜index.vue
┃ ┣ 📂auth
┃ ┃ ┣ 📂t-login
┃ ┃ ┃ ┗ 📜index.vue
┃ ┃ ┣ 📂t-register
┃ ┃ ┃ ┗ 📜index.vue
┃ ┃ ┗ 📂t-reset-password
┃ ┃ ┃ ┗ 📜index.vue
┃ ┣ 📂detail
┃ ┃ ┗ 📂t-question-detail
┃ ┃ ┃ ┗ 📜index.vue
┃ ┣ 📂internal
┃ ┃ ┗ 📂report
┃ ┃ ┃ ┣ 📂t-report-problem
┃ ┃ ┃ ┃ ┗ 📜index.vue
┃ ┃ ┃ ┗ 📂t-report-user
┃ ┃ ┃ ┃ ┗ 📜index.vue
┃ ┣ 📂list
┃ ┃ ┣ 📂t-categories-list
┃ ┃ ┃ ┗ 📜index.vue
┃ ┃ ┗ 📂t-notification-list
┃ ┃ ┃ ┗ 📜index.vue
┃ ┗ 📂post-list
┃ ┃ ┗ 📂t-question-post-list
┃ ┃ ┃ ┗ 📜index.vue
┗ 📂xelements
┃ ┣ 📂bar
┃ ┃ ┗ 📂x-app-bar
┃ ┃ ┃ ┗ 📜index.vue
┃ ┣ 📂dropdown
┃ ┃ ┗ 📂x-profile-dropdown
┃ ┃ ┃ ┗ 📜index.vue
┃ ┣ 📂icon
┃ ┃ ┗ 📂x-icon
┃ ┃ ┃ ┗ 📜index.vue
┃ ┣ 📂modal
┃ ┃ ┣ 📂x-profile-more-modal
┃ ┃ ┃ ┗ 📜index.vue
┃ ┃ ┗ 📂x-user-list-modal
┃ ┃ ┃ ┗ 📜index.vue
┃ ┣ 📂observe
┃ ┃ ┗ 📂x-observe-visibility
┃ ┃ ┃ ┗ 📜index.vue
┃ ┣ 📂skeleton
┃ ┃ ┗ 📂x-question-card-skeleton
┃ ┃ ┃ ┗ 📜index.vue
┃ ┗ 📂state-block
┃ ┃ ┗ 📂x-basic-state-block
┃ ┃ ┃ ┗ 📜index.vue
ex: In Main.vue (Layout)
.layout.main-layout
o-app-preloader
o-app-header
main.layout-columns-wrapper
.bx--grid
.bx--row
.bx--col-lg-3
.bx--col-lg-11.px-0
.sidebar
h3 Sidebar
.bx--col-lg-6
x-app-bar
o-question-filter-nav-bar(:links="filterLinks")
.nuxt-view-wrapper
nuxt
.bx--col-lg-3
aside.sidebar
p(v-if="$fetchState.pending") Fetching categories...
p(v-else-if="$fetchState.error") Fetching error. {{ $fetchState.error.message }}
o-categories-block(v-else :categories="category.items")