1.在使用vue-roter的时候报错

UncaughtTypeError:vue_router__WEBPACK_IMPORTED_MODULE_5__.default.createWebHashHistory is not a function

部分代码

import VueRouter from "vue-router";

const router = VueRouter.createRouter({
    // 4. 内部提供了 history 模式的实现。为了简单起见，我们在这里使用 hash 模式。
    history: VueRouter.createWebHashHistory(),
    routes, // `routes: routes` 的缩写
})

直接把createRouter和createWebHashHistory结构出来不会报错。

import { createRouter,createWebHashHistory } from "vue-router";

const router = createRouter({
    // 4. 内部提供了 history 模式的实现。为了简单起见，我们在这里使用 hash 模式。
    history: createWebHashHistory(),
    routes, // `routes: routes` 的缩写
})

使用<router-link>不能点击

代码

<template>
  <img alt="Vue logo" src="./assets/logo.png">
  <p>
  <router-link to="/hello">Go to Hello</router-link>
    <br/>
  <router-link to="/about">Go to About</router-link>
  </p>
  <router-view></router-view>
</template>

可以看到此时 <router-link>并不是一个超链接！

原因是app.use()里面的顺序错误！

错误的

app.use(ElementPlus,router)

改成

正确

app.use(router,ElementPlus) 

或者

app.use(ElementPlus).use(router)

或者

app.use(router).use(ElementPlus)

mian.js

import Vue, { createApp } from 'vue'
import App from './App.vue'
import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'
import { createRouter,createWebHashHistory } from "vue-router";
import Hello from './components/Hello'
import About from './components/About'

// 每个路由都需要映射到一个组件。
// 我们后面再讨论嵌套路由。
const routes = [
    { path: '/hello', component: Hello },
    { path: '/about', component: About },
]

// 3. 创建路由实例并传递 `routes` 配置
// 你可以在这里输入更多的配置，但我们在这里
// 暂时保持简单
const router = createRouter({
    // 4. 内部提供了 history 模式的实现。为了简单起见，我们在这里使用 hash 模式。
    history: createWebHashHistory(),
    routes, // `routes: routes` 的缩写
})

//确保 _use_ 路由实例使
//整个应用支持路由。

const app = createApp(App)
app.use(router);
app.mount('#app')

app.use()里面的顺序不对会导致很多莫名错误

 一定要注意app.use()里面的顺序！！！

要不就app.use().use()... 要注册几个组件就use几个！！！