vue打包发布路由问题,,,,

vue打包发布后,可以正常操作,但是如果我刷新页面或者在浏览器上方地址栏回车的话,报错404找不到页面,

2个回答

vue-router用的history模式?

q395212409
依稀的回忆 回复人到中年就秃头: https://router.vuejs.org/zh/guide/essentials/history-mode.html#E5%90%8E%E7%AB%AF%E9%85%8D%E7%BD%AE%E4%BE%8B%E5%AD%90 需要服务器端做一下重定向
8 个月之前 回复
qq_41906761
人到中年就秃头
8 个月之前 回复

打包后不是在服务器上运行的吧 , 是直接在文件夹打开吗?

qq_41906761
人到中年就秃头 我是直接用tomcat运行的
9 个月之前 回复
Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
其他相关推荐
vue history 路由模式打包发布到服务器设置
要求描述 页面访问地址 首页:https://hello.haha.com/world 用户中心 :https://hello.haha.com/world/user 路由设置 路由配置js 设置 mode 为history ,这样会去掉#号 和正常的路由地址一样 export default new Router({ mode: 'history', routes: [ { ...
vue 打包发布注意的细节
打到 config -> index.js 找到build对象 把productionSourceMap:true改成false 因为这个东西在打包的时候会给你生成很多SourceMap的东西;占用的空间会很大;主要是用来帮助我们调试的; ...
Vue打包发布项目
<p>rn <br />rn</p>rn<p>rn <p>rn 20周年限定一卡通!<span style="color:#337FE5;">可学Java全部课程</span>,仅售799元(原价7016元),<span style="color:#E53333;">还送漫威正版授权机械键盘+CSDN 20周年限量版T恤+智能编程助手!</span>rn </p>rn <p>rn 点此链接购买:rn </p>rn <table>rn <tbody>rn <tr>rn <td>rn <span style="color:#337FE5;"><a href="https://edu.csdn.net/topic/teachercard?utm_source=jsk20xqy" target="_blank">https://edu.csdn.net/topic/teachercard?utm_source=jsk20xqy</a><br />rn</span>rn </td>rn </tr>rn </tbody>rn </table>rn</p>rn<p>rn <br />rn</p>rn<p>rn <br />rn</p>rn<p>rn 本阶段以Vue项目为主,涵盖及时:Vue基础知识点,Vue-Router,Vuex,Fetch等技术栈相关内容,并且包含完整实战项目rn</p>
Vue项目打包发布到tomcat
Vue项目打包发布到tomcat npm run build Nodejs服务器安装: npm install -g serve 1、本地测试运行打包的vue: serve dist 访问:http:localhost:5000 打包部署到tomcat服务器 修改配置:webpack.prod.conf.js ...
VUE嵌套路由的问题
var foo = { template : ` div>父级div> router-view>router-view> ` } 嵌套路由的时候,复制了官网的例子,你如父组件嵌套子组件的时候,你要像以上那样写,那么就会失效的 一定要外边包裹一层容器如下: //定义组件 var foo = { te
Vue — 路由的相关问题
        刚开始用vue做项目遇到了一些问题,在此做一下分享。      (一)关于子路由的配置        路由配置是spa必须可少的一步,做过spa肯定对路由的配置格外顺手,但是很多人可能不太熟悉子路由是如何进行配置的。        最近这个项目主要分四个频道,/home,  /producs, /solutions, /about        /about 这个频道下,又分为四个...
Vue 路由的传参问题
此种传参方式不需要通过路由后面写:id这中方式而是通过router-link方式传参方法如下&amp;lt;router-link :to=&quot;{ name: 'user', params: { userId: 123 }}&quot;&amp;gt;User&amp;lt;/router-link&amp;gt; router.push({ name: 'user', params: { userId: 123 }}) 之后在收到参数的页...
vue路由之命名路由
一、通过:to=&quot;{name:'other'}&quot;的命名。   1、添加 :to=&quot;{name:'other'}&quot; &amp;lt;router-link to=&quot;/home&quot; tag=&quot;span&quot;&amp;gt;首页&amp;lt;/router-link&amp;gt; &amp;lt;router-link to='/about' tag=&quot;span&quot;&amp;gt;关于&amp;lt;/rout
angular6使用PathLocationStrategy路由策略打包发布的问题
问题描述 开发的一个angular项目,采用的是PathLocationStrategy路由策略,打包完成之后,直接运行index.html文件,发现引入的main.js路径不对,报404错误,项目中也引入了一些图片,也是路径引入不对,报404错误。 经过调试发现,图片和main.js引入的全部是/根目录,受到&amp;amp;lt;base href=&amp;quot;/&amp;quot; /&amp;amp;gt;这个影响,因此直接在index.html中...
Vue动画 和 Vue路由
Vue动画 和 Vue路由一.transition: Vue1.0: <p transition="fade"></p>.fade.transition{} .fade-enter{} .fade-leave{} (一).Vue2.0以后,transition组件 <transition name="fade"> 运动的内容(元素,属性,路由...)
Vue路由
Vue Router 是 Vue.js 官方的路由管理器。它和 Vue.js 的核心深度集成,让构建单页面应用变得易如反掌。包含的功能有: 嵌套的路由/视图表 模块化的、基于组件的路由配置 路由参数、查询、通配符 基于 Vue.js 过渡系统的视图过渡效果 细粒度的导航控制 带有自动激活的 CSS class 的链接 HTML5 历史模式或 hash 模式,在 IE9 中自动降级 自定义的滚动条行...
vue路由
去除链接中的 # const router = new VueRouter({ mode: 'history', routes: [...] }) 如果路由路径错误时跳转到根目录: {path:'*',redirect:'/'}, 动态绑定路由 &lt;router-link :to="Contact"&gt;联系我们&lt;/router-link&gt;&lt;!--...
vue 路由
下面代码展示了路由的基本功能 &amp;lt;!DOCTYPE html&amp;gt; &amp;lt;html lang=&quot;en&quot;&amp;gt; &amp;lt;head&amp;gt; &amp;lt;meta charset=&quot;UTF-8&quot;&amp;gt; &amp;lt;meta name=&quot;viewport&quot; content=&quot;width=device-width, initial-scale=1.0&q
【VUE】路由
动态路由 路由 +:参数 的形式来使用动态路由 Vue.use(Router) export default new Router({ mode: 'history', routes: [ { path: '/good/:goodid', name: 'GoodList', component: GoodL...
vue——路由
路由数据初始化在created执行,更新用watch 路由的刷新 路由在离开再载入后会刷新,所以可以定义个空白路由,在created内跳转回原路由。 在起始原路由定义跳转到空白路由的方法,作为刷新 路由的传参 路由可以在跳转时用params传参 &amp;lt;router-link :to=&quot;{name:'new-view',params:{id:id}}&quot;&amp;gt;&amp;lt;/...
vue 路由
vue 路由 @路由 1. ? 什么是路由 2. 使用场景 3. 路由的安装 4. 如何使用 5. 嵌套路由 编程路由 动态路由 1.&amp;gt; 我自己的理解是由不同的路径,显示不同组件,根据不同的组件显示不同的内容\页面。(做单页面应用) 2.&amp;gt; a.单页面跳转。 b.组件与组件之间的切换。 c.局部刷新内容。 d.vue中的路由用于指定跳转特定页面,多用于单页面应用SPA ...
vue之路由
路由的过程 首先把路由模块安装到node_module当中 $ npm install vue-router --save 安装好后就是把引入路由模块 然后使用路由 接下来就是配置路由 展示路由 路由过程解析 安装路由模块很简单直接 $ npm install vue-router --save 2.安装好路由后,这边有两种配置理由的方式,一种是在main.js中配置路由,另一种是重...
vue的路由
vue-router的路由设置 vue的路由跳转使用一个插件(vue-router)来实现 vue-router路由官方网址:https://router.vuejs.org vue-router基本使用 新建一个router文件夹,在其index.js文件中编写 import Vue from “vue”; import VueRouter from “vue-router...
Vue——路由②
1. 路由编程 之前是通过router-link标记生成页面的a标记,然后进行url转向的 但也可以通过编程的方式来实现 router.push(location,onComplete?,onAbort?) App.vue &amp;lt;template&amp;gt; &amp;lt;div id=&quot;app&quot;&amp;gt; &amp;lt;img src=&quot;./assets/logo.png&quot;&amp;gt; &amp;lt;...
Vue - 路由
路由配置以及路由重定向(redirect) routes: [ { path: '/', redirect: '/pageA' }, { path: '/pageA', name: 'pageA', component: pageA }, { path: '/...
Vue——路由①
1. 安装设置路由组件 vue-router $npm install vue-router --save --save-exact 安装精确版本 src/router/index.js import Vue from 'vue' 导入路由 import Router from 'vue-router' import HelloWorld from '@/components/Hell...
相关热词 c++和c#哪个就业率高 c# 批量动态创建控件 c# 模块和程序集的区别 c# gmap 截图 c# 验证码图片生成类 c# 再次尝试 连接失败 c#开发编写规范 c# 压缩图片好麻烦 c#计算数组中的平均值 c#获取路由参数