Multiple vuecli projects are packaged and deployed on the Apache server

After the default vue project is packaged into the dist folder, directly copy the contents of the dist folder (excluding the dist folder) to the xampp/htdocs folder, and then you can open the project through the server ip address. However, it needs to be deployed in the htdocs
folder For multiple projects, some configuration is required.

Step 1: Configure in vue.config.js

publicPath:'//'

The publicPath is followed by your folder name

Step 2: Set in index.js in router

base:'//'

After base is also your folder name

Step 3: Add a .htaccess file to the packaged project and


change the place marked in the red circle to your folder name

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

Step 4: Find the httpd.conf file

Find the line AllowOverride None, change it to AllowOverride All,
restart the server and run it