vue cli3项目发布在apache www/vue目录下并配置history路由
注意:vue项目打包后默认是指向服务器的根路径(比如apache默认www目录是根路径,当然也可以修改),这种情况不需要做路径的配置,只需要做history配置,如果不是发布到根路径而是www/vue目录下,则需要做路径配置,并做history配置
一、 需要修改router.js中new Router 配置,加一个 base: '/vue/', 它指定应用的基路径,默认是根路径'/',表示该应用是服务于localhost/vue路径下,所以必须加base配置,否则应用会展示404页面,当然了用history路由的话也必须加 mode: 'history';
二、 在vue.config.js的 module.exports = { publicPath: '/vue/' }; , 默认根路径'/'
三、 修改httpd.conf文件,开启rewrite_module功能:
1. LoadModule rewrite_module libexec/apache2/mod_rewrite.so,去掉前面的#,打开注释。一般搜索 mod_rewrite.so 能够找到,不同的服务器可能前面的红色路径不太一样
2. 找到 AllowOverride None 的那行,把它改成 AllowOverride All,来使 .htaccess 文件生效。
四、 在apache 的www/vue 目录下新建 .htaccess文件(此文件是看不到目录的但是在命令行貌似可以查到), 需要修改RewriteRule 为/vue/index.html, 否则刷新页面服务端会直接报404错误
.htaccess文件内容
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index\.html$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /vue/index.html [L]
</IfModule>
发布到其他路径或是更深的路径配置都是类似的
参考:https://segmentfault.com/a/1190000012548105
vue cli3项目发布在apache www/vue目录下并配置history路由的更多相关文章
- apache+php+mysql windows下环境配置
需要注意的是,目前apache和php以及mysql都要用32位的,机子是64位的也是安装32位.我之前安装64位的版本,总是出现问题.回归正题: 所需要软件: 1.apache:去官网下载,我这边用 ...
- vue项目打包后想发布在apache www/vue 目录下
使用的是vue-element-admin做示例,可以参考Vue项目根据不同运行环境打包项目,其他项目应该大同小异. 使用vue-router的browserHistory模式,配置mode: 'hi ...
- vue cli3 项目配置
[转]https://juejin.im/post/5c63afd56fb9a049b41cf5f4 基于vue-cli3.0快速构建vue项目 本章详细介绍使用vue-cli3.0来搭建项目. 本章 ...
- vue@cli3 项目模板怎么使用public目录下的静态文件,找了好久都不对,郁闷!
作为图片最好放在static目录下,但是vue@cli3没有static,网上都说放在public目录下,行,那就放吧,可问题是图片放了怎么使用 第一次尝试 肯定用绝对路径这就不说了,用相对路径,we ...
- 让webstorm 识别vue cli3项目中的@路径别名
在setting -> languages&frameworks -> webpack里选择配置文件路径为 node_modules/@vue/cli-service/webpac ...
- MVC项目中,如何访问Views目录下的静态文件!
<!--注意,是system.webServer节点,而非system.web--><system.webServer> <handlers> <add na ...
- Apache限制某个目录下的PHP文件没有执行权限
为了安全期间,有时我们需要限制网站下的某些目录对于php脚本不能执行. 有两种方法可以参考: 1. 使用.htaccess 文件限制 在要限制php执行的目录下,创建.htaccess文件,加入内容 ...
- apache的bin目录下的apxs有什么作用? PHP模块加载运行方式
2016-03-26 16:40:28 一个perl脚本安装http server扩展模块用的apxs - APache eXtenSion tool –with-apxs2=/usr/local ...
- Maven项目中读取src/main/resources目录下的配置文件
在Maven项目的开发中,当需要读取src/下的配置文件时,该怎么做? 我们假设Resources下有一个文件名为kafka.properties的配置文件(为什么用kafka.properties, ...
随机推荐
- Linux 服务器安装jdk,mysql,tomcat简要教程
linux服务器是阿里云上买的,学生价9.9/月,拿来学习下. 需要准备软件工具: 1.editplus (编辑服务器上的文件) 2.PuTTY (Linux命令连接器) 3.FlashFXP(上传文 ...
- FinalCutPro快捷键
FinalCutPro快捷键使用 FinalCutPro的快捷键使用十分有用,特对一些基本的快捷键进行了总结 1)i:截取片段开始Initial 2)o: 截取片段结束Over i和o可以在一个素材片 ...
- shell 部分语法
语法: variable_name=${variable_name:-xxxx} 如果variable 已经有值,则不被新值覆盖,否则将新值赋给variable split命令切割文件
- spring_quartz的实现
一.在spring配置文件中引用对应的定时任务配置文件 二.定义定时任务的业务代码 三.配置定时任务配置文件spring-quartz.xml <?xml version="1.0&q ...
- Web jsp开发自学——ajax+servlet+echarts+json+gson 实现ajax传输servlert和echarts的数据,可视化结果
感谢下面的博主,我学习的博客有: https://blog.csdn.net/ITBigGod/article/details/81023802 Jsp+Servlet+Echarts实现动态数据可 ...
- 【D3D12学习手记】CPU/GPU Synchronization
由于有两个并行运行的处理器(CPU和GPU),会出现许多同步问题.假设我们有一些资源R存储了我们希望绘制的某些几何体的位置. 此外,假设CPU更新R的数据以存储位置p1,然后将引用R的绘图命令C添加到 ...
- 从 ssh private key 中重新生成 public key
Use the -y option to ssh-keygen: ssh-keygen -f ~/.ssh/id_rsa -y > ~/.ssh/id_rsa.pub From the 'man ...
- Mysql:常用操作(导入数据,用户授权,远程连接授权,设置通信缓冲区的最大长度)
1.导入数据命令: mysql --host=localhost --port=3306 --user=root --password=hnsjt_lwsj@2018 szyszx_20180515- ...
- JavaScript(1)——编程真善美
编程真善美 命名风格: 驼峰命名法 小驼峰法 变量一般用小驼峰法标识.驼峰法的意思是:除第一个单词之外,其他单词首字母大写:camelCase 大驼峰法(即帕斯卡命名法) 相比小驼峰法,大驼峰法把第一 ...
- ubuntu安装dockers和images:dvwa
docker安装 安装前需要更新系统 apt-get update apt-get upgrade apt-get install docker.io 安装完之后就可以试下: docker docke ...