For those who are just getting started, we can first understand what vue is:
VUE : Progressive javaScript framework.
What is JS (JavaScript): I encapsulate a function, and this function can be called by other people. This is a js
What is a framework: The rules of a framework.
Before starting the project creation, we need to make the following preparations. The specific operations can be downloaded from the official website.
Prerequisites:
- Node.js version 16.0 or higher installed
- Vue scaffolding tool has been built
- Configure environment variables
So let's start creating a VUE project in VSCode:
1. Create an empty folder on the desktop, here I name it test1
2. Open the VSCode interface, menu bar-terminal-new terminal
3. Enter in the terminal window at the bottom of the interface: npm init vue@latest
4. Run and output the following code. If you are not sure what the options are, just press Enter to skip all the y/n questions here.
Here I named his file: vue-project. You can edit your own file name when creating it.
5. Copy and paste the running code in the terminal according to the green font code above:
The execution results are as follows:
6. Congratulations on getting to this point! The project has been created. Wait for a few minutes, and the browser interface will pop up automatically as shown below. If the browser window does not pop up automatically, we can manually copy the local address in the third to last line in the picture, open the browser and paste it into the address bar, and press Enter to test whether we have successfully created it. vue project.
The interface shown above appears in the browser, indicating that a vue project has been successfully created. Now you can start your journey of small front-end projects.
Reference article: https://cn.vuejs.org/guide/quick-start.html#creating-a-vue-application