vue uses HTML5 history mode to publish on IIS

The hash mode is used by default in page routing developed by Vue. In this mode, the URL will carry a # sign. Like this: http://www.abc.com/#/hello.
If you don't want this # sign to appear, you can use history mode. Just make the following modifications in the routing configuration:

const router = new Router({
    
    
  routes,
  mode: 'history'
})
//本文编写时，官网是v3版本 ：https://v3.router.vuejs.org/zh/guide/essentials/history-mode.html
//现在新建的项目应该默认采用V4版本的Router，https://router.vuejs.org/zh/guide/essentials/history-mode.html
//而V4版本下配置方式略有不同，则启用H5模式配置具体如下：
import {
    
     createRouter, createWebHistory } from 'vue-router'

const router = createRouter({
    
    
  history: createWebHistory(),
  routes: [
    //...
  ],
})

However, using history will bring about a problem, that is, after publishing, 404 will appear when the page is refreshed or backed out. The solution is to add a candidate resource on the server side that covers all situations.
Different web server configurations are different. For details, check the official information: HTML5 history mode

I published it using IIS. When I tested the release on a win10 computer, it was normal, but when I got to the server, an IIS error occurred. The reason is that IIS7.0 used by the server does not support rewrite by default.
The solution is to install the URL Rewrite module. Download and install URL Rewrite Module 2.0 from the official website.
If you look carefully enough, you will find that it is also mentioned in vue Route. But I didn't pay attention at the time.

I have sorted out the link:
re_write_x86_zh_CN.msi from microsoft

re_write_x64_zh_CN.msi from microsoft

After downloading and installing on the server, you can use web.config normally.