Should I use nginx to rewrite Nuxt.js

Question

I am using Nuxt.js to develop a website now.

I wrote some pages in the Page Folder.

Pages/
  Index.vue
  profile/
     Index.vue

Then , When I access

http://www.mywebsite.com/
http://www.mywebsite.com/profile

will show the Index.vue in Pages/ and profiles/

Now , I need my website using url to define the language of website , like

http://www.mywebsite.com/en/   English
http://www.mywebsite.com/ja/profile  Japanese

So I use nginx with proxy_pass and rewrite to solve this problem I use the configs below

proxy_pass http://localhost:7777;
rewrite ^/cn/(.*) /$1 last;

In developing (run npm dev / nuxt), The site will render the redirected page and turn to blank page with the error immediately . Which is said that the server and client is not sync .

I think the problem is the development mode will auto reload , so the server can detect the url is not same as the pages path.

Then I try to run

nuxt build
npm start

The site is builded and the redirect is success.

Here is some questions

1) How can I stop the detection when i use "npm dev" ? If I run "npm start" , the page will not be updated anymore even I update the file.

2) I will detect urls language and load different language json file. will this affect Nuxt.js 's Server Side Rendering ?

3) Any other simpler way to solve my problem ? or any nuxt/vue can perform "lang in URL" and let server render all languages' page correctly ?

Answer 1

For 2) and 3), there is actually a much simpler approach, without using nginx

https://github.com/nuxt-community/nuxt-i18n

You can find exact example of what you want to achieve here

https://nuxt-community.github.io/nuxt-i18n/routing.html#routing