Vue Build
“Build” mode should replace “development mode” after a Vue project is completed.
Our Vue project is compiled into.html,.js, and.css files by the build command, which makes them ready for instant browser operation.
Our Vue project is designed to generate files that can be accessed by others on a server.
To 'Build' The Web Page
The Vite build tool has been operating a development server for our projects thus far in this tutorial, which is known as “development mode.” Vite quickly updates the page when you save changes you make while developing. The computer needs to use a lot of resources for this.
The page is prepared for public release during the development phase, which is followed by the build stage. The next step is to integrate our project into browser-compatible files without launching Vite in development mode. Performance is enhanced and server resource consumption is reduced by performing the construction phase.
Press ‘Q’ or ‘ctrl’+’C’ to halt the development server if it is running, and then write the following code to build your Vue application:
When your project is generated, instead of using the *.vue files we use during development, Vite creates a folder called dist that contains all the files required to execute your project on a public server. These files are *.html, *.css, and *.js, which are files the browser understands.
Use the following commands to view your constructed project in the browser:
The created project from the dist folder should be visible in the browser window that opens after running this commando.