Teach you step by step how to package the vue project and deploy it to the server (novice tutorial)

1. Tools needed

vscode download link: Visual Studio Code - Code Editing. Redefined

FinalShell download link: FinalShell official website

2. Packaging steps

1. Open your vue project with vscode --> click terminal --> enter npm run build and press Enter to package;

 2. The packaging is successful, the dist folder is generated, and the packaged files will be stored in it by default;


 

3. Use FinalShell to connect to the server and obtain the pagoda panel address


1. Download FinalShell:
Click the following link: FinalShell official website

2. Select the version that suits your computer system and download it.


3. After downloading and installing the software, double-click to open it, select SSH connection, fill in the following information, and finally click OK


4. After the connection is successful
(1) Enter the command: bt
(2) Check whether the Pagoda is installed on the server. If it is installed, the Pagoda panel command will appear. If it is not installed, refer to the following link: Pagoda panel download, a free and versatile server operation and maintenance software ( This tutorial uses a Linux server)
(3) Enter 14 to view and copy the external network panel address, user name, and password


(4) Paste the just copied external network panel address into the browser

(5) Enter the user name and password to log in. The following page will appear. Click the website on the left-->Add site-->Enter the domain name-->The root directory address will be automatically generated-->Click submit-->The site is created successfully.

 

(6) Click on the root directory to enter the upload page

(7) Click Upload and upload the contents of the previously packaged dist folder as shown below.
         After the upload is successful, you can access the project through the domain name.

Guess you like

Origin blog.csdn.net/Orange71234/article/details/131327494