Vue2 構成のルーティングと操作中に発生した問題

1、报错：エクスポート「デフォルト」（「VueRouter」としてインポート）が「vue-router」に見つかりませんでした

元のコード:

//引入插件
import Vue from 'vue';
import VueRouter from 'vue-router';

//使用插件
Vue.use(VueRouter);

//引入路由组件
import Home from '@/pages/Home';
import Login from '@/pages/Login';
import Register from '@/pages/Register';
import Search from '@/pages/Search';

//配置路由
export default new VueRouter({
    
    
    //配置路由
    routes: [
        {
    
    
            path: "/home",
            component: Home
        },
        {
    
    
            path: "/login",
            component: Login
        },
        {
    
    
            path: "/register",
            component: Register
        },
        {
    
    
            path: "/search",
            component: Search
        },
        // 重定向，在项目跑起来的时候，访问/，立马让他重定向到首页
        {
    
    
            path: "*",
            redirect: "/home"
        }
    ]
})

理由: [email protected]+ はこの書き方をサポートしていません
。

//引入插件
import Vue from 'vue';
import {
    
     createRouter, createWebHistory } from "vue-router";

//引入路由组件
import Home from '@/pages/Home';
import Login from '@/pages/Login';
import Register from '@/pages/Register';
import Search from '@/pages/Search';

const routes = [
    {
    
    
        path: "/home",
        component: Home
    },
    {
    
    
        path: "/login",
        component: Login
    },
    {
    
    
        path: "/register",
        component: Register
    },
    {
    
    
        path: "/search",
        component: Search
    },
    // 重定向，在项目跑起来的时候，访问/，立马让他重定向到首页
    {
    
    
        path: "/:pathMatch(.*)",
        redirect: "/home"
    }
]

const router = createRouter({
    
    
    history: createWebHistory(),
    routes
})

export default router

2、报错: すべてのルートをキャッチ (「*」) は、カスタム正規表現のパラメーターを使用して定義する必要があります。

解決策：*になります/:pathMatch(.*)

{
    
    
	path: "/:pathMatch(.*)",
	redirect: "/home"
}

3、报错：「http://localhost:8080/iconfont.css」の MIME タイプ (「text/html」) がサポートされているスタイルシート MIME タイプではなく、厳密な MIME チェックが有効になっているため、「http://localhost:8080/iconfont.css」からスタイルを適用することを拒否しました。

解決策: reset.css を削除します。@import "./iconfont.css";

4. vue2 プロジェクトが誤って vue-router 4.x バージョンをダウンロードした

理由: cnpm install --save vue-routervue-router の最新バージョンが自動的にインストールされます. 上記の問題を解決すると、依然としてルートの登録に失敗することがわかりました. vue2 は vue-router 3.x と vue-router 4 を使用する必要があることがわかりました. x は vue3 と組み合わせて使用​​されます。解決策:
構成が復元される前に vue-Router のバージョンを下げます。

cnpm i vue-router@3.5.2 -legacy-peer-deps