vue-cli4.5.x quickly builds a project

1. Install vue-cli

npm i @vue/cli -g

2. Create a project

vue-cli will create a complete project folder, including src, etc. We only need to cd into the folder where we plan to place the project file and execute the following code;

1. Generate project files;

Terminal input:

vue create projectname

2. Select the generation configuration method

Select the bottom item here for manual configuration
(If you like to use eslint, just choose vue3)

3. Plugin Selection

Select the plugin you need, use the up and down arrows to move, and use the spacebar to switch the selected state.

Did you make the wrong choice or miss one? Don’t worry, you can still modify the plugin configuration through the Vue UI after the build is completed (as described below)

I am not very familiar with ESLint, so I won’t show off here...
The lowest level of unit testing and end-to-end testing (E to E Testing) can be started if there is a need;

4. Single item configuration

Select the first option "Choose Vue version" to configure it individually:
Enable HTML5 history mode for vue-router?

This is recommended to enable, which will make your URL cleaner and more readable;
In SPA pages, many methods rely on HTML5 history mode;

How are you going to store these config files for things like babel & eslint?

Here I recommend the first option... Generate a separate configuration file, so that when you modify it, you only need to find the corresponding configuration file to modify the corresponding configuration;

OK, do you plan to use the configuration of this build project in the future?

It's up to you to decide...
If you select Yes, the fourth option will appear next time you execute the first step, which is your customized configuration method.

Give your own configuration a name: projectname

5. Choose a package management tool

You will be asked to choose between npm or yarn. I did not show it here and used npm directly, which is weird.
Just choose the one you want to use.

This completes the creation.

Then let’s run it and see!

npm run serve

Enter the corresponding port and you can see the initial interface of Vue.

3. VueUI modification configuration

Open cmd, enter "vue ui" and wait for the GUI service to start, and a UI interface based on the local service will automatically open

Import your project file, and then you can quickly run the project, install the plugin, uninstall the plugin, etc. under the plugin category on the left.

Add-on - Deleting saved configuration options

If you save the configuration, there will be one more configuration of your own next time you use it. Too many may be a bit dazzling.

These configurations will be saved in the ".vuerc" file under the Administrator on the C drive

Just delete the corresponding object.

Summarize

This is the end of this article about vue-cli4.5.x quick project building. For more related vue-cli4.5.x project building content, please search 123WORDPRESS.COM's previous articles or continue to browse the following related articles. I hope everyone will support 123WORDPRESS.COM in the future!