从vue小白到高手，从一个内容管理网站开始实战开发第四天，使用Element UI构建页面-页面路由的配置-登录(二)

昨天我们在项目中创建了一个登录页面，但是发现登录页面无法打开，始终显示vue的默认页面。昨天也说了是因为我们没有给项目配置路由，那么今天我们就看看怎么给我们的项目配置路由，让我们可以通过浏览器的地址栏来访问到我们的页面。

一、项目正式开发前的准备工作

之前我们一直在介绍vue项目，从创建到安装element-ui库都没有提到过nodejs的事情，那是因为如果不再关键点介绍，大家容易理解有误或不容易记忆。

从这篇文章开始进行配置路由和安装项目使用的基础插件了，在安装和配置过程中会遇到版本问题，如果各版本不对应，则安装插件过程中会出现很多问题，解决起来很麻烦。

1、node.js版本

首先我的机器上安装的nodejs是16.x 版本的，Nodejs下载：https://nodejs.org/download/release/v16.19.0/

2、Element UI版本

我们使用的Element UI是2.0

3、VUE CLI版本

使用的VUE CLI版本是2.7.13，详情可查看package.json文件

下面是package.json文件中项目使用的各版本情况

{
  "name": "default",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build"
  },
  "dependencies": {
    "