The vue3.0 project is built using vue-cli
Tell me about your recent learning
Recently, I have been in a hurry to learn something and solve some problems. I can see through the problem. I saw a lot of posts sharing the content and tried it on my own problem to solve it. Later, I reflected that it couldn't be like this.
1. The knowledge has not improved.
2. I don’t know where to start when encountering problems
.
After thinking about it, when encountering a problem, we must try our best to find the basis and the root of the problem so that we can solve the problem fundamentally when we encounter it in the future. The important point is to find the API documentation to understand it in depth. (Do you guys have the same feelings as me!!!)
start building
vue-cli API location: https://cli.vuejs.org/zh/guide/installation.html
Install
First, see if you have installed vue-cli. It will appear to indicate that you have installed it.
vue --version
After the installation command is installed, check whether the installation is successful, or the above steps.
npm install -g @vue/cli
# OR
yarn global add @vue/cli
Create a project hello-world is the project name will automatically create a project folder
vue create hello-world
We use our own choice of configuration, select up and down, press Enter,
select the component you want, and select cancel. Generally, we need router and vuex. We choose to
select the version of vue version,
and select the mode of vue-router.
There are two modes of vue-router (front-end routing), Hash mode and history mode, here are the differences between the two.
Hash refers to the # after the tail of the url and the following characters. History has no bottom band #, which looks better than the hash mode. The
difference in principle (principle)
hash is compatible to IE8, and history is only compatible to IE10;
due to changes in the hash value It will not cause the browser to send a request to the server, and the hash change will trigger the hashchange event (hashchange can only change the url fragment after #); although the hash path appears in the URL, it will not appear in the HTTP request, completely affecting the backend It has no effect, so changing the hash value will not reload the page, basically using hash to implement front-end routing.
Select the ESLint syntax detection configuration
and press Enter to indicate when to use ESLint. Here, you can choose to save, which is the default. As shown below.
After pressing Enter, the next option is configured in the configuration file or in the package.json file. Here, choose to configure the alias in the configuration file
and press Enter to start creating the project.
The project is created successfully.
The error reported after creating the project is actually a syntax detection error.
