在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>