构建静态页面

1、将HelloWorld.vue的模板修改为

<template>
  <div>
    hello, world
  </div>
</template>

2、将App.vue的模板修改为

<template>
  <div id="app">
    <router-view/>
  </div>
</template>

script中添加引入样式表

import './assets/stylesheets/main.css'

3、添加样式表
在assets下添加文件夹stylesheets,同时添加文件main.css和home.css
main.css

@import './home.css'

home.css
将App.vue下的style下的样式移动到home.css文件中

#app {
    font-family: 'Avenir', Helvetica, Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-align: center;
    color: #2c3e50;
    margin-top: 60px;
  }

你可能感兴趣的:(vue,vue.js)