多个vuecli项目打包部署到Apache服务器上

默认vue项目打包到dist文件夹后,直接复制dist文件夹中(不含dist文件夹)的内容到xampp/htdocs文件夹下,就可以通过服务器ip地址打开项目
但是, 需要在htdocs文件夹中部署多个项目时,就需要做一些配置.
在这里插入图片描述
在这里插入图片描述

第一步:在vue.config.js中配置
在这里插入图片描述

publicPath:'//'

publicPath后面是你的文件夹名字

第二步:在router里的index.js里面设置
在这里插入图片描述

base:'//'

base后面也是你的文件夹名字

第三步:在打包后的项目中新增一个.htaccess文件
在这里插入图片描述
在这里插入图片描述
红圈标出的地方改成你的文件夹名

<IfModule mod_rewrite.c>
  RewriteEngine On
  RewriteBase /
  RewriteRule ^index\.html$ - [L]
  RewriteCond %{REQUEST_FILENAME} !-f
  RewriteCond %{REQUEST_FILENAME} !-d
  RewriteRule . /index.html [L]
</IfModule>

第四步:找到httpd.conf文件
在这里插入图片描述

找到AllowOverride None 那行,改成AllowOverride All
重启服务器运行就好了

猜你喜欢

转载自blog.csdn.net/weixin_37818738/article/details/126862113