Spring_Vue前后分离记录1（vue从安装到使用的两种方式）

$ npm -g install npm
$ npm -g install @vue/cli

$ vue create helloindex

$ vue init webpack vueproject_name

$ npm run dev

$ vue ui

$ npm run serve

<template>
    <div>
        {{msg}}
        <table>
            <tr>
                <td>编号</td>
                <td>书名</td>
                <td>作者</td>
            </tr>
            <tr v-for="item in books">
                <td>{{item.id}}</td>
                <td>{{item.name}}</td>
                <td>{{item.auth}}</td>
            </tr>
        </table>
    </div>
</template>
<script>
    export default {
        name: "book.vue",
        data(){
            return {
                msg:"book!",
                books:[
                    {
                        id:1,
                        name:'狂人日记',
                        auth:'鲁迅'
                    },
                    {
                        id:2,
                        name:'呐喊',
                        auth:'鲁迅'
                    }
                ]
            }
        }
    }
</script>
<style scoped>
</style>

{
    path: '/book',
    name: 'Book',
    component: () => import(/* webpackChunkName: "about" */ '../views/book.vue')
  }