vue hash和history打包

Posted 2023-04-11

参考技术A hash模式打包比较简单，只需要将config下的assetsPublicPath改为'./'就可以了

history需要服务端的支持，否则在刷新的时候会404

首先找到config文件夹下的index.js

    I-将路由模式修改为history模式

    II-将dev和build下的assetsPublicPath修改成/nginx配置的目录名称/，注意， 必须是'/'开头'/'结尾

    III-找到router的根文件，在mode属性下新增base属性，值与assetsPublicPath的值保持一致

    IV-找到index.html文件将资源引用路径改成以assetsPublicPath的值开头的形式引入，并增加meta标签，值同assetsPublicPath的值

    V-找到nginx目录下的conf文件夹，找到nginx.conf，新增如下配置

    

vue路由history,hash 区别

直观区别：
hash模式url带#号，history模式不带#号。

深层区别：
hash模式url里面永远带着#号，我们在开发当中默认使用这个模式。 如果用户考虑url的规范那么就需要使用history模式，因为history模式没有#号，是个正常的url适合推广宣传
功能也有区别，比如我们在开发app的时候有分享页面，那么这个分享出去的页面就是用vue或是react做的，
咱们把这个页面分享到第三方的app里，有的app里面url是不允许带有#号的，所以要将#号去除那么就要使用history模式但是使用history模式还有一个问题就是，在访问二级页面的时候，做刷新操作，会出现404错误，那么就需要和后端人配合让他配置一下apache或是nginx的url重定向，重定向到你的首页路由上就ok啦。