πŸ“‚Folder Structure

Since Light Able comes with a gulp, it has minor differences in structure but one can pick any one and start making changes, both are totally independent.

└── πŸ“ public
 |    β”œβ”€β”€ favicon.svg
 |    └── index.html
β”œβ”€β”€ πŸ“ src
 |    └── πŸ“ assets
 |    |    β”œβ”€β”€  πŸ“ css
 |    |    β”œβ”€β”€  πŸ“ fonts
 |    |    β”œβ”€β”€  πŸ“ images
 |    |    β”œβ”€β”€  πŸ“ json
 |    |    └──  favicon.svg
 |    |
 |    └── πŸ“  components
 |    |    β”œβ”€β”€  πŸ“ common
 |    |    β”œβ”€β”€  c-footer.vue
 |    |    β”œβ”€β”€  c-menu.vue
 |    |    β”œβ”€β”€  c-navbar.vue
 |    |    β”œβ”€β”€  footer.vue
 |    |    β”œβ”€β”€  page-header.vue
 |    |    β”œβ”€β”€  right-bar.vue
 |    |    └──  slidebarar.vue
 |    |
 |    └── πŸ“  layout
 |    |    β”œβ”€β”€  c-main.vue
 |    |    β”œβ”€β”€  c-vertical.vue
 |    |    β”œβ”€β”€  c-navbar.vue
 |    |    β”œβ”€β”€  component.vue
 |    |    β”œβ”€β”€  layout-2.vue
 |    |    β”œβ”€β”€  horizontal.vue
 |    |    β”œβ”€β”€  main.vue
 |    |    └──  vertical.vue
 |    |
 |    └── πŸ“  router
 |    |    β”œβ”€β”€  index.js
 |    |    └──  router.js
 |    |
 |    └── πŸ“  state
 |    |    β”œβ”€β”€  πŸ“ modules
 |    |    β”œβ”€β”€   helper.js
 |    |    └──   store.js
 |    |
 |    └──  πŸ“ views
 |    |     β”œβ”€β”€    πŸ“  components       
 |    |     └──    πŸ“  live-preview  
 |    |
 |    β”œβ”€β”€   App.vue 
 |    β”œβ”€β”€   authutils.js
 |    └──   main.js    
 |    β”œβ”€β”€  .gitingore
β”œβ”€β”€ app.config.json
β”œβ”€β”€ jsconfig.json
β”œβ”€β”€ package.json
└── vue.config.js

Light Able Vue Folders Structure

Last updated