Step 2: Live Server

Laravel

1. At your laravel folder

2. Go to .env file.

3. Configure variables related to live server and comment out variables related to local server.

1. Move all content from the public folder to parent directory, Which including .htaccess, favicion.ico, index.php and robots.txt

At the index.php, replace all the directory to your laravel project direction.

require __DIR__.'/../xxxxxxx

to

require __DIR__.'/laravel/xxxxxxx

Vue

Packaging the Vue.js project

Vue.js project can be packaged so that it can be easily deployed in the live server. Run the command below to produce a packaged version of the Vue.js project.

npm run build

Then, a folder named "dist" will be created at the root directory. Move all content from the dist folder to parent directory, which include assets, index.html, vite.svg.

Another simple way to move packaging file automatic

There is a way to automatic move all the file from dist folder to specific directory.

At your vite.config.js, add outDir and specify the directory, for example, we want to move the content from dist to outside of vue folder.

      build: {
    outDir: '../' // Specify the new output directory here
  }

After then, when you npm run build again, it will automatic packaging at parent directory

npm run build

Successful Run at Live Server

Developer might zip or git the file to server, and at the end, the server directory should be look like this