springboot+vue健康管理小项目（二）前端页面创建

前端页面创建

1.使用vue ui 创建项目

使用cmd命令窗口进入想要创建项目的目标文件，使用命令vue ui创建项目

如果vue ui 无反应

原因：vue框架版本低于3.0
解决方法：升级vue

查看版本号

vue -V

先卸载老版本

npm uninstall vue-cli -g

重新安装

npm install @vue/cli -g

成功

2.进入vue管理器创建项目

• 

安装插件

安装依赖

删除项目相关配置和内容

APP.vue

<template>
  <div id="app">
    APP根结点
  </div>
</template>

<script>

</script>

<style>

</style>

index.js

import Vue from 'vue'
import VueRouter from 'vue-router'


Vue.use(VueRouter)

const routes = [
  
]

const router = new VueRouter({
  routes
})

export default router

main.js

import Vue from 'vue'
import App from './App.vue'
import router from './router'
import './plugins/element.js'

Vue.config.productionTip = false

new Vue({
  router,
  render: h => h(App)
}).$mount('#app')

修改完页面