关于vue单页面应用访问路径添加项目名的设置步骤

我想要的访问路径效果如图：

1.在index.html的头部中设置红框圈中的代码：

2.在router.js中设置路由模式如下（设置history是为了去掉默认的#锚点）：

3.在vue.config.js中设置公共根路径如下:

4.在开发和生产环境中设置默认基路径，防止首次进入页面未点击路由导航时不显示页面：

 

 

如有更好的方法，请留言指教。谢主隆恩啦！