1.引入，預處理main.ts

import {} from 'vue-router'

import { createRouter, createWebHistory } from 'vue-router'

import HomePages from '@/pages/HomePages.vue'

import AboutPage from '@/pages/AboutPage.vue'

import NewsPage from '@/pages/NewsPage.vue'

//1. 配置路由規則

const routes = [

  { path: '/', redirect: '/home' },

  { path: '/home', component: HomePages },

  { path: '/about', component: AboutPage },

  {

    path: '/news',

    component: NewsPage,

    name: 'news',

    children: [

      { path: '1', component: () => import('@/pages/newsDetail1.vue') },

      { name:'事項2'