The purpose of each folder of the vue-cli scaffolding initialization project

node_modules: Project dependency folder

public: generally place some static resources (pictures). It should be noted that the static resources placed in the public folder will be packaged in the dist folder intact when webpack packs them.

src (programmer source code folder):

• assets: generally used to store static resources (static resources shared by multiple components), it should be noted that static resources placed in the assets folder, when webpack packs, webpack will treat static resources as a module and package them into JS inside the file.
• components: generally place non-routing components (global components)
• pages: store routing-related components (pages can also be replaced with views)
• router: routing configuration file
• store: vuex related files
• api: Put the file about the secondary packaging of axios
• App.vue: the only root component (summarizes all components)
• main.js: The entry file, which is also the first file executed in the entire program

.gitignore: configuration ignored by git version control (generally do not touch)

babel.config.js: babel configuration file (equivalent to a translator, such as translating ES6-related syntax into ES5, better compatibility, generally do not touch)

package.json: application package configuration file (similar to a project ID card, which records information such as project name, project dependencies, project operation, etc.)

package-lock.json: Package version control file (cacheable file)

README.md: application description file (descriptive file)

vue.config.js: Scaffolding can be customized, how to configure can refer to Vue CLI

Initialize other configurations of the vue project

1. The browser automatically opens

In the package.json file, add --open --host=localhost after the serve attribute

"scripts": {
 "serve": "vue-cli-service serve --open --host=localhost",
 "build": "vue-cli-service build",
 "lint": "vue-cli-service lint"
},

2. Close the eslint verification tool

Create a vue.config.js file: it needs to be exposed to the outside world

module.exports = {
   lintOnSave:false,
}

3. Setting the alias of the src folder

Note: The latest vue scaffolding version has been configured by default.
Because when the project is large, src (source code folder): there will be many directories inside, and it is not convenient to find files. The advantage of setting the alias of the src folder is that it will be more convenient to find files

Create jsconfig.json file 

{
    "compilerOptions": {
        "baseUrl": "./",
        "paths": {
            "@/*": [
                "src/*"
            ]
        }
    },
    "exclude": [
        "node_modules",
        "dist"
    ]
}