Vue3 + Vue-Router4 我的配置方法
之前对Vue颇有怨言，其实人家写得挺好，唯一缺点就是缺少代码规范约束。
说到底一个是我年龄太大，接纳不了新技术，还一个就是教程里什么写法都有。
看了下公司项目，之前的写法是：
// main.js
import { createApp } from "vue";
import App from "./App.vue";
import router from './router'
const app = createApp(App);
app.use(router);
app.mount("#app");// router.js（保密需要这里修改了路径）
import * as vueRouter from "vue-router";
import Home from "./components/Home.vue";
import Order from "./components/Order.vue";
const routes = [
{ path: '/', component: Home },
{ path: '/order', component: Order },
];
const router = vueRouter.createRouter({
history: vueRouter.createWebHistory(),
routes: routes
});
export default router;不仅需要把路由单独分一个文件，而且每次增加栏目都要先import然后再写进component，非常费劲。
出于代码量越少越好的理念，我把路由做了精简，删掉了router.js，直接合并进main.js：
// main.js
import { createApp } from "vue";
import App from "./App.vue";
import * as Router from "vue-router"; // 修改部分
const app = createApp(App);
app.use(Router.createRouter({ // 修改部分
history: Router.createWebHistory(),
routes: [
{ path: '/', component: import("./components/Home.vue") },
{ path: '/order', component: import("./components/Order.vue") },
]
}));
app.mount("#app");简单粗暴，直接揉进主配置文件即可。
至于Router为何用大写，个人认为从vue-router导入的是整个类，而不是某个方法，大写是合理的。