1.2 Initializing the Vue Front End

Keywords: vue, yarn, node

Since I want to manage both my Vue front end and express back end in a Git directory, I’ll initialize the Vue project in the server path I initialized earlier, which I’ll call app

1. Install vUE scaffolding under the root path, which is the tool for building VUE projects – G for global installation

npm install -g vue-cli
Copy the code

2. Use the WebPack packaging tool. Here I named the front-end project app

vue init webpack app
Copy the code

You’ll be prompted with a few messages, most of which can be yes and just keep hitting Enter. When only the package management tool was selected, I changed the default NPM to YARN because I wanted to use YARN.

Note: YARN and NPM have similar functions as package management tools. I feel more powerful than NPM. Especially during team development, YARN automatically downloads its own version package according to the Settings in the local package, avoiding errors caused by inconsistent package versions. Because I just touch the front end, the level is limited, still in the process of learning, if there is something wrong, I hope you can forgive and put forward valuable suggestions. Thank you very much.

3. After a crazy output, the front-end initialization of Vue is basically completed.

4. Access the app file, initialize yarn, and start the project

cd app
yarn
yarn run dev
Copy the code

5. And then we can get therehttp://localhost:8080See the Vue project you just initialized