vue 中引入 mnt-ui 可是在页面中并不显示，而且vue是通过 render的方式添加到页面中的

在vue页面中添加了 mint-ui 的样式，可是在vue的模板中并没有显示，并且vue是通过render 的方式添加到html中的，在使用的时候浏览器却出现了runtime-only的错误，并且在引入mint-ui 的时候，对于css文件的拦截使用的拦截器，loader和use有什么区别么，为什么使用use会报错，只能使用 loader进行拦截器的加载

  module: {
        rules: [
            {
                test: /\.vue$/,
                use: 'vue-loader'
            }, {
                test: /\.css$/,
                loader: 'style-loader',
                loader: 'css-loader'
            }, {
                test: /\.jpg$/,
                use: 'url-loader'

<template>
  <div>
    <ul v-for="(item,index) in list" v-bind:key="index">
      <li>{{ item.id }} +"..."+{{ item.name }}</li>
    </ul>
    <span class="glyphicon glyphicon-heart" aria-hidden="true">aa</span>

    <router-link to="/app1">app1</router-link>
    <router-link to="/app2">app2</router-link>
    <router-view></router-view>


    <mt-button type="primary">primary</mt-button>
  </div>
</template>
<script>
export default {
  data() {
    return {
      list: [
        { id: 1, name: "111" },
        { id: 2, name: "222" },
        { id: 3, name: "333" },
        { id: 4, name: "444" }
      ]
    };
  }
};
import $ from "jquery";
$(function() {
  $("ul>li:odd").css("backgroundColor", "pink");
  $("ul>li:even").css("backgroundColor", "purple");
});
</script>
<style>
@import "../node_modules/bootstrap/dist/css/bootstrap.css";
@import "./css/index.css";
****@import "../node_modules/mint-ui/lib/style.css";****
</style>