Can the index.html page be used as a component template page too?


Can the index.html page be a component page with template section ?

< script >
return …

pageInit: function(e, page) {

or should I use this below to redirect to an internal page instead to do this?

app.router.navigate(’/start-page/’, {
reloadCurrent: true,
pushState: false

any ideas?

the reason of this because I want all app scripts be loaded and present a loading page transition as a welcome screen and when all things has been loaded up and ready show the page…

if I use

app.router.navigate(’/start-page/’, {
reloadCurrent: true,
pushState: false

the problem the loading transition start but it does then to the /start-page/ suddenly and then the transition cannot see that page has finished loaded and the transition is not smooth…

any ideas?


Just follow this guide


thanks again!! I do appreciate your prompt reply!! I am using framework7 for all the project here and seeing all things I can do with it… it is awesome!


I tried many time with initial-page-route solution but i could still do succesfully. So, Could you help me to give a template about how to use index.html as a component template, please?
Thank you for spend time with me.


index.html leave it with all your .css .js and use another page as the index page of your app…

in my case I created home.html and inside routes.js create just this:

var routes = [
  // Index page
    path: '/',
    componentUrl: './pages/home.html',
    name: 'home',

use path ‘/’ to be your home page and componentUrl to indicate it is a component page with template.

in your home.html use < template > as usual and that is it! :slight_smile:


Thank you so much. Hope you are always have fun my friend.


I am happy that you could solve it :slight_smile: