回顾:前面我们搭建好了springmvc,mybatis后端环境,以及vue,webpack前端环境。这部分,我们的目标是引入vue常用的一些特性,如element-ui和router,然后进行前后端联调
第四步(上)
首先,我们理一哈vue-cli生成了哪些文件,先看webpack.config.js
可见,js入口文件为src/main.js,然后webpack给我们打包到dist/build.js
src/main.js文件内容如下,为vue入口
import Vue from 'vue'
import App from './App.vue'
new Vue({
el: '#app',
render: h => h(App)
})
然后,vue-cli给我们生成的第一个vue文件App.vue,内容如下(省略掉style代码)
<template>
<div id="app">
<img src="./assets/logo.png">
<h1>{
{ msg }}</h1>
<h2>Essential Links</h2>
<ul>
<li><a href="https://vuejs.org" target="_blank">Core Docs</a></li>
<li><a href="https://forum.vuejs.org" target="_blank">Forum</a></li>
<li><a href="https://chat.vuejs.org" target="_blank">Community Chat</a></li>
<li><a href="https://twitter.com/vuejs" target="_blank">Twitter</a></