app.vue

<template>
  <div id="app">

    <router-view/>
  </div>
</template>
<script>
export default {
  name: 'App'
}
</script>
<style lang="less">

</style>

index.vue

<template>
  <div class="login-container">
  登录界面
  </div>
</template>

<script>
export default {
  name: 'LoginIndex',
  components: {
  },
  props: {},
  data () {

  }
}
</script>
<style scoped lang="less">

</style>

main.js

import Vue from 'vue'
import App from './App.vue'
import router from './router'
import './styles/index.less'
// 加载组件库
import ElementUI from 'element-ui'
// 加载样式
import 'element-ui/lib/theme-chalk/index.css'
Vue.config.productionTip = false
// 注册组件库
Vue.use(ElementUI)
new Vue({
  router,
  render: h => h(App)
}).$mount('#app')

index.js

import Vue from 'vue'
import VueRouter from 'vue-router'
import Login from '@/views/login/index'
Vue.use(VueRouter)

// 路由配置表
const routes = [{
  path: '/login',
  name: 'login',
  component: Login
}]
const router = new VueRouter({
  routes
})

export default router

运行结果