美文网首页
vue SEO 使用预加载遇到的巨坑(被坑哭了)

vue SEO 使用预加载遇到的巨坑(被坑哭了)

作者: 风飞燕 | 来源:发表于2019-08-15 18:17 被阅读0次
    我项目快完了的时候,上帝让作seo,然后用了这个 prerender-spa-plugin
    

    然鹅,百度上人人都说成功了的方法,我已用就遇到坑了,将静态页面转化为html之后刷新就会变成下面这个样子


    巨坑.png

    我先描述下问题,问题一,router中mode:history之后,在ngnix的server下配置了这个

      location / {
                root   C:\Users\Administrator\Desktop\enassHtml;
                index  index.html index.htm;
               try_files $uri $uri/ /index.html;
            }
    

    嗯~ o( ̄▽ ̄)o,这个在没有做seo的时候是木有问题的,但是用了之后的结果是很感人的,百度出来的结果都是,你选择打包的静态界面,打包之后dist文件夹里面有你需要打包的文件夹然后里面有一个html文件,如'/serviceHome',打包之后的路径是dist->serviceHome->index.html
    之后绝望降临,更新服务器,你可以看到他成功实现了,但是你一刷新,立马出现如上问题。一个是多了一个斜线,一个是js,css没有加载,能力有限,针对于第二个问题找到了一种很lou的解法,退出来给实在没有办法的人一个参考

    错误示范.jpg 错误2.png

    正确的路径


    正确.png

    这里可以看出是路径的问题,然后没有找到有效,简单的解决方法
    目前的方法是修改打包的文件里面如serviceHome这个的html中相关的路径
    啊,其他好的解决方法留给广大网有吧,
    然后我最终的解决方式是弃用子路由,使用组件的方式,我的页面是有几个界面的切换的,之前我用v-if来进行展示,然后发现只有第一块的能展示出来,然后使用display:none,然后能用了(感觉我的方法只是用我的项目),最后,希望有大神能看到这个问题,帮忙解决一下,非常感谢

    相关文章

      网友评论

          本文标题:vue SEO 使用预加载遇到的巨坑(被坑哭了)

          本文链接:https://www.haomeiwen.com/subject/coissqtx.html