Vue-cli3 multi-page development, a single page needs to use router, to use html5's history mode, the page opens blank

vue.config.js

module.exports = {
    baseUrl: process.env.NODE_ENV === "production" ? "" : "/",
    outputDir: "dist",
    assetsDir: "assets",
    productionSourceMap: false,
    filenameHashing: false,
    lintOnSave: true,
    pages,
    devServer: {
        historyApiFallback: true,
        overlay: {
            warnings: true,
            errors: true
        },
        open: true,
        hotOnly: false
    }
}

folder directory

pagesexperiencerouterrouter.js

after starting the service, the browser enters the address http://localhost:8080/experience.html page to display a blank. If you do not use history mode, the page can be accessed normally.
should be a problem with the path. Ask God to take a look, where is the path wrong?

Multi-page-application history routing vue-router vue-cli

Aug.13,2021

/experience.html

you don't have routing configured for this

all routes accessed by http://localhost:8080/ in this way need to be configured in router.js

is there a solution? I also encountered the same problem. I now delete router-view and put it in App.vue instead of components, but this can not achieve one-sided route jump. There is a solution to tell

I also encountered this problem, solved link description

Previous: The docker installation swoft environment appears to be unreachable

Next: The load event of "iOS12+ Wechat browser" image is triggered in advance.