最近在开发cms的时候使用Vue.js框架,利用vue-route、vue-cli结合webpack编写了一个单页路由项目,自己在服务器端配置apache。部署完成后,访问没问题,从页面中点击跳转就会报错,就会出现404现象!在本地开发中是没有这个问题的,调试的时候一切都是正常的。

步骤一:

  在config/index.js文件里的assetsPublicPath改成你放在服务器的文件路径里,根目录就是:/   如果是放在某个文件夹,例: /vuep/

步骤二:

  在自己的路由配置中加入base属性,属性的值根据自己项目放置的位置来设定,如图所示,我自己的就是:/vuep/

步骤三:

  设定完这些后,在Apache服务器上路由跳转是有问题的,需要在apache的配置文件httpd.conf里面配置路由跳转,(注:如果是放在根目录,RewriteRule的值就是./index.html [L] ,因为我自己的是放在vuep文件夹里面的)如图所示,在配置文件加入如下代码:

AllowOverride all
RewriteEngine On
RewriteBase /
RewriteRule ^index\.html$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ./vuep/index.html [L]

配置完这些后,自己的项目就可以在apache服务器正常跳转了

vue部署服务器以及解决部署到apache路由出现404的更多相关文章

  1. Visual Studio 2017 系统发布部署服务器教程

    Visual Studio 2017 系统发布部署服务器教程       一.公司网站部署 --- 第一档 _Visual Studio 2017 发布网站系统教程  二.公司网站部署 --- 第二档 ...

  2. Nodejs学习笔记(1) Nodejs安装+借助express模块简单部署服务器

    1 安装 1.1 下载和安装 1.2 什么是REPL?如何使用? 1.3 npm对单一模块的安装和删除功能 1.4 通过package.json自定义模块(安装模块) 1.5 设置全局目录 2 部署网 ...

  3. vue 路由部署服务器子目录问题

    http://blog.csdn.net/hero82748274/article/details/73436497 <Egret 引擎入门> 这两天一直在查询vue经过打包后部署服务器一 ...

  4. 在同一个Apache服务器软件上部署多个站点的基础方法

    这篇文章主要介绍了Apache中Virtual Host虚拟主机配置及rewrite模块中的重要参数说明,是在同一个Apache服务器软件上部署多个站点的基础方法,需要的朋友可以参考下(http:// ...

  5. [原创]经历:asp.net oracle 部署问题以及解决方法

    精简的美丽...... 一.环境    开发环境        win7 64bit         Vs2010        Oracle 11g r2 64bit        <inst ...

  6. HP DL160 Gen9服务器集群部署文档

    HP DL160 Gen9服务器集群部署文档 硬件配置=======================================================Server        Memo ...

  7. 经历:asp.net oracle 部署问题以及解决方法

    原文:[原创]经历:asp.net oracle 部署问题以及解决方法 精简的美丽...... 一.环境    开发环境        win7 64bit         Vs2010       ...

  8. 网站建设部署与发布--笔记2-部署Apache

    网站部署(Linux) 部署Apache 操作系统:CentOS 7.2 1.首先连接云服务器,清楚系统垃圾. $ yum clean all Loaded plugins: fastestmirro ...

  9. maven intall在target文件夹中自动生成的war包部署服务器时缺斤少两

    1.问题描述,本地改动特别大或者升级系统操作,打war包部署服务器上程序时候,页面或者后台总是报错,原因就是比本地少东西. 2.问题排查解决:maven clean然后maven intall在tar ...

随机推荐

  1. Airtest结合tidevice实现IOS自动化测试

    这篇博文内容,是基于之前的配置而来的.我们可以先回顾一下之前博文,Windows搭建mac黑苹果系统:WebDriverAgent重签名爬坑记 . 今天来分享下如何通过 tidevice实现IOS自动 ...

  2. shell脚本 binlog方式增量备份mysql

    一.简介 源码地址 日期:2018/4/12 介绍:复制Binlog日志方式的增量备份脚本,并保存固定天数的备份 效果图: 二.使用 适用:centos6+ 语言:中文 注意:使用前先修改脚本中变量 ...

  3. 用工具堆砌的DevOps 幻觉

    作者:顾宇 thoughtworks高级咨询师 在第一届 DevOpsDays结束后,DevOps 运动则如星火燎原之势在全球发展开来.随着 DevOps 思想的不断传播,相对的质疑和批评也从未停止过 ...

  4. Log4j漏洞源码分析

    Log4j漏洞源码分析 这几天Log4j的问题消息满天飞,今天我们就一起来看看从源码角度看看这个漏洞是如何产生的. 大家都知道这次问题主要是由于Log4j中提供的jndi的功能. 具体涉及到的入口类是 ...

  5. 09 - Vue3 UI Framework - Table 组件

    接下来做个自定义的表格组件,即 table 组件 返回阅读列表点击 这里 需求分析 开始之前我们先做一个简单的需求分析 基于原生 table 标签的强语义 允许用户自定义表头.表体 可选是否具有边框 ...

  6. 阿里面试题: (a,b,c)组合索引, 查询语句select...from...where a=.. and c=..走索引吗?

    面试官:(a,b,c)组合索引,查询语句select...from...where a=.. and c=..走索引吗应聘者: 最佳左前缀法,如果索引了多列,要遵守最左前缀法则,否则索引失效 按最左前 ...

  7. generating project in interactive mode

    解决方案:加个参数 -DarchetypeCatalog=internal 让它不要从远程服务器上取catalog

  8. C++11 新特性:enable_shared_from_this

    enable_shared_from_this是一个模板类,定义于头文件<memory>,其原型为:template< class T > class enable_share ...

  9. Python pyecharts绘制折线图

    一.pyecharts绘制折线图line.add()方法简介 line.add()方法简介 add(name,x_axis,y_axis,is_symbol_show=True, is_smooth= ...

  10. c++ 设计模式概述之享元

    类写的不够规范,目的是为了缩短篇幅,实际中其不要这样做. 参考文章: 1. http://c.biancheng.net/view/1371.html 1.概述 A.享元,我的理解是: 共享的模块单元 ...