Building our apps for production
Deploying applications to production starts with creating an artifact that can be deployed. In the case of Vue.js, we’re building a client-side application, which means our build artifact will contain HTML, JavaScript, and CSS files.
A Vue project scaffolded with Vite will have a build
command. As part of the build process, Vite will take JavaScript, Vue single-file components, and modules that are imported into each other and bundle them. Bundling means that related chunks of code that depend on each other will be output as a single JavaScript file.
The Vue CLI build step also includes a dead code elimination
step. This means that it can analyze the code being generated and if any of it is never used – for example, a statement such as if (false) { /* do something */}
– then it will not be present in the build output.
By default, the Vite builds for production when we call vite build
, which, in Vue projects, is aliased...