Search code examples
vue.jsnuxt.jsvue-router

Vuejs - Getting 404 when reload the product page

In vue project when i go to product detail page from home page it works, but when i reload the product detail page, it returns 404, also when i access the product page directly it return 404. It works only when i go by clicking on product.

This issue is on production (server) only. In localhost it is working perfectly.

When i add this to htaccess it works but home page comes first for a second.

<IfModule mod_negotiation.c>
  Options -MultiViews
</IfModule>

<IfModule mod_rewrite.c>
  RewriteEngine On
  RewriteBase /
  RewriteRule ^index\.html$ - [L]
  RewriteCond %{REQUEST_FILENAME} !-f
  RewriteCond %{REQUEST_FILENAME} !-d
    RewriteRule . /index.html [L]

</IfModule>

I am new to vuejs. Hope someone can help with this. Thanks.

Solution

  • I used async and await and it worked for me.

    async fetch() {
  await axios.get();
}