1. The data definition in main.js is a json object, not a function

2、vm is not used :

solution:

Modify the rules in package.json :

    "rules": {
      "no-unused-vars": 0,
      "no-console": 0
    }

3. -- fix : vue.config.js add lintOnSave: false,

4. The pop-up page IP is 0.0.0.0 error:

solution:

 vue.config.js  添加：
 devServer: {
        host: 'localhost',
        port: 8080
    }

5. Import vue error: (change the default import Vue from “Vue”)

Why change the default import Vue from "Vue"? If you do not modify it, you will find that the data in the view cannot be updated.
Because the default import is actually vue.runtime.common.js, the function is not complete, and only the runtime-only method is provided.
Solution:
① Import Vue from '../node_modules/vue/dist/vue directly in main.js ② import Vue from 'vue' // Use this method to add alias specific configuration
in vue.config.js
as follows:

const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
  transpileDependencies: true,
  devServer: {
    host: 'localhost',
    port: 8080
  },
  chainWebpack: config => {
    // 添加别名
    config.resolve.alias
      .set("vue$", "vue/dist/vue.js")
  }
})

6. Garbled characters appear on the browser page after starting vue:

Set the encoding format in the html of vscode and vue to utf-8

7、-- export 'default' (imported as 'VueRouter') was not found in 'vue-router' "vue-router": "^4.1.5"

Solution:

Go back to 3.1.3 and test again, it can run

npm install -g [email protected]

Reason for error:
vue-router is the official routing plug-in of Vue.js. It is deeply integrated with vue.js and is suitable for building single-page applications.
When we install routing on the official website or do not specify the version when installing, that is, router4.X is installed by default.
And what we created is vue2, which can only be used in combination with vue-router 3.x version. So you need to lower the version of vue-router.

8. Install routing, install animated.css, and pay attention to version issues when installing vuex and other plug-ins later.

Use cnpm i plugin name -S

The installation will install the latest version of the plug-in by default. If there is an exception, it is a version compatibility problem, and the plug-in version needs to be reduced.

Such as:
-- vue2.0 uses animate.css(animate.css@^4.1.1) invalid
D:\vs-work\06-vueanimated> cnpm uninstall animate.css@^4.1.1
npm install [email protected] .1 --save

Summary of Vue error reporting from installation to operation (stepping on the pit)