Views

Views Folder

Same as the component folder each views has his own folder with a: Vue Javascript file, SCSS file for styling and a .Vue file for html.

πŸ“‚src
β”œβ”€β”€ πŸ“‚views
β”‚Β Β  β”œβ”€β”€ πŸ“‚Home  #View component folder
β”‚Β Β  β”‚Β Β  β”œβ”€β”€ Home.js
β”‚Β Β  β”‚Β Β  β”œβ”€β”€ Home.scss
β”‚Β Β  β”‚Β Β  β”œβ”€β”€ Home.vue
β”‚Β Β  β”‚Β Β  └── index.js
β”‚Β Β  β”‚Β Β  ..
β”‚Β Β  └── index.js
..

The index.js file is for indexing all the views in the views folder. This makes importing in the routes file easier. See Router & Routes how to import views in the router.

Not Found View

Also added is the Not Found page to show the user a 404 Error not found page.

Adding components to views

import { Button, FormItem } from '@/components';

Using the generator CLI

If you using the structure generator it can generate the files and imports for you. Depending on the chosen answers it will generates a view folder with the files: Index.js, {component}.js, {component}.scss and {component}.vue. And it will add the import of the view in the index.js file in Views folder.

You can also generate the route for the view.

For more info check the Generator Guide.