Apache configuration

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

Nginx configuration

location / {
  try_files $uri $uri/ /index.html;
}
Copy the code

Nginx configuration in vue history mode

 server {
         listen 80;

         server_name testwx.wangshibo.com;
         root /Data/app/xqsj_wx/dist;
         index index.html;

         access_log /var/log/testwx.log main;

}
Copy the code

server { listen 80; server_name testwx.wangshibo.com; root /Data/app/xqsj_wx/dist; index index.html; access_log /var/log/testwx.log main; Location / {try_files $uri $uri/ @router; index index.html; } location @router { rewrite ^.*$ /index.html last; }}Copy the code

The original Node. Js

const http = require('http')
const fs = require('fs')
const httpPort = 80

http.createServer((req, res) => {
  fs.readFile('index.htm', 'utf-8', (err, content) => {
    if (err) {
      console.log('We cannot open "index.htm" file.')
    }

    res.writeHead(200, {
      'Content-Type': 'text/html; charset=utf-8'
    })

    res.end(content)
  })
}).listen(httpPort, () => {
  console.log('Server listening on: http://localhost:%s', httpPort)
})
Copy the code

Node.js-based Express

For Node.js/Express, consider using the connect-history-API-Fallback middleware

Internet Information Services (IIS)

1. Install IIS UrlRewrite
2. Create a web.config file in the root directory of your website with the following contents:

<? The XML version = "1.0" encoding = "utf-8"? > <configuration> <system.webServer> <rewrite> <rules> <rule name="Handle History Mode and custom 404/500" stopProcessing="true"> <match url="(.*)" /> <conditions logicalGrouping="MatchAll"> <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" /> <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" /> </conditions> <action type="Rewrite" url="/" /> </rule> </rules> </rewrite> </system.webServer> </configuration>Copy the code

Caddy

rewrite {
    regexp .*
    to {path} /
}
Copy the code

Firebase host

Add the following to your firebase.json:

{
  "hosting": {
    "public": "dist",
    "rewrites": [
      {
        "source": "**",
        "destination": "/index.html"
      }
    ]
  }
}
Copy the code

The last

Be warned, because by doing so, your server will no longer return a 404 error page because the index.html file will be returned for all paths. To avoid this, you should overwrite all routing cases in the Vue application and then render a 404 page.

// Pay attention!! Const router = new VueRouter({mode: 'history', routes: [{path: '/', Component: home}, {path: '/detail', component: detail }, { path: '*', component: NotFoundComponent } ] })Copy the code

The above is from blog.csdn.net/weixin_4075…

The operation is really effective, specially backup a copy of the operation record, I hope to help you, my environment is under the pagoda operation

1. Vi Open the file, enter the file, and save the file

2. Modify the configuration file