Vue怎样剔除路径#号

这次给大家带来Vue怎样剔除路径#号,Vue剔除路径#号的注意事项有哪些,下面就是实战案例,一起来看一下。

众所周知,vue-router有两种模式,hash模式和history模式。

带#的则是hash模式。

将router中的mode设置为history就可以了

Vue怎样剔除路径#号

接下来有个问题,界面一刷新,就变404了!!!!

网上搜了下,需要对后端环境进行一个配置。

这里只列举nginx的配置,其他的配置点击这里去官网看

先配置config/index.js

修改assetsPublicPath为根目录

module.exports = {  build: {      env: require('./prod.env'),      index: path.resolve(dirname, '../dist/index.html'),      assetsRoot: path.resolve(dirname, '../dist'),      assetsSubDirectory: 'static',      assetsPublicPath: '/',   // hash 模式会默认的在此处 添加为 assetsPublicPath: './'      productionSourceMap: true,      ...    }}

登录后复制

然后配置nignx

server {    listen 0.0.0.0:12345;    location / {        root /home/我的应用跟目录;        try_files $uri $uri/ /index.html =404;  // 这个是重点    }    error_page 404 /index.html}

登录后复制

Url再也没有#了,多完美

相信看了本文案例你已经掌握了方法,更多精彩请关注【创想鸟】其它相关文章!

推荐阅读:

vue中ajax请求与axios包完美处理

Element Traversal实现元素遍历详解

以上就是Vue怎样剔除路径#号的详细内容,更多请关注【创想鸟】其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。

发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/2766828.html

(0)
上一篇 2025年3月8日 11:26:00
下一篇 2025年3月7日 19:20:17

AD推荐 黄金广告位招租... 更多推荐

相关推荐

  • vue-cli怎样做出跨域请求

    这次给大家带来vue-cli怎样做出跨域请求,vue-cli做出跨域请求的注意事项有哪些,下面就是实战案例,一起来看一下。 前端开发时,请求后台接口经常需要跨域,vue-cli实现跨域请求只需要打开config/index.js,修改如下内…

    编程技术 2025年3月8日
    200
  • JS怎样操作红黑树

    这次给大家带来JS怎样操作红黑树,JS操作红黑树的注意事项有哪些,下面就是实战案例,一起来看一下。 红黑树的性质 一棵满足以下性质的二叉搜索树是一棵红黑树 每个结点或是黑色或是红色。 根结点是黑色的。 每个叶结点(NIL)是黑色的。 如果一…

    2025年3月8日 编程技术
    200
  • 毕达哥拉斯树怎样用JS实现

    这次给大家带来毕达哥拉斯树怎样用JS实现,毕达哥拉斯树用JS实现的注意事项有哪些,下面就是实战案例,一起来看一下。 效果如下: 主要方法 translate() rotate() rect() push() pop() map() 主要思想…

    2025年3月8日
    200
  • el表达式怎样判断非空

    这次给大家带来el表达式怎样判断非空,el表达式判断非空的注意事项有哪些,下面就是实战案例,一起来看一下。 场景: 页面跳转后,使用spring mvc向前端页面传过来一个json对象,要在js中获取后,做处理。 返回的json对象: {“…

    编程技术 2025年3月8日
    200
  • ueditor自定义上传按钮怎样在vue使用

    这次给大家带来ueditor自定义上传按钮怎样在vue使用,ueditor自定义上传按钮在vue使用的注意事项有哪些,下面就是实战案例,一起来看一下。 由于上传地址问题,需要自定义上传按钮,效果如图 由于在页里面没有操作dom,所以想到了用…

    2025年3月8日 编程技术
    200
  • webpack配置打包后图片路径出错如何处理

    这次给大家带来webpack配置打包后图片路径出错如何处理,处理webpack配置打包后图片路径出错的注意事项有哪些,下面就是实战案例,一起来看一下。 问题 项目在开发环境下工作正常,当打包后图片不见了,检查元素后发现路径出错了。 图片路径…

    2025年3月8日
    200
  • 修改npm全局安装模式的路径步骤详解

    这次给大家带来修改npm全局安装模式的路径步骤详解,修改npm全局安装模式的路径的注意事项有哪些,下面就是实战案例,一起来看一下。 在正式写此文章之前,我得说一点血泪史。 刚学nodeJS不久,很纳闷为什么全局安装的模块在 ‘n…

    2025年3月8日
    200
  • 修改Nodejs内置配置路径步骤详解

    这次给大家带来修改Nodejs内置配置路径步骤详解,修改Nodejs内置配置路径的注意事项有哪些,下面就是实战案例,一起来看一下。 Nodejs 内置的npm默认会把模块注意事项在c盘的用户AppData目录下(吐槽一下:不明白为啥现在的软…

    2025年3月8日 编程技术
    200
  • nodejs取得当前执行路径步骤详解

    这次给大家带来nodejs取得当前执行路径步骤详解,nodejs取得当前执行路径的js有哪些,下面就是实战案例,一起来看一下。 process.cwd() 当前执行程序的路径(执行命令行时候的路径,不是代码路径 例如 在根目录下执行 nod…

    编程技术 2025年3月8日
    200
  • 设计模式的策略模式怎样在前端中使用

    这次给大家带来设计模式的策略模式怎样在前端中使用,设计模式的策略模式在前端中使用注意事项有哪些,下面就是实战案例,一起来看一下。 什么是策略模式? GoF四兄弟的经典《设计模式》中,对策略模式的定义如下: 定义一系列的算法,把它们一个个封装…

    2025年3月8日 编程技术
    200

发表回复

登录后才能评论