vue中使用scss

vue中使用scss

1.安装依赖包

npm install sass-loader sass-resources-loader  style-loader css-loader --save

2.更改webpack.base.conf.js

//在module下的rules中增加如下规则：

module: {
    rules: {
        ...
        {
            test:/\.scss$/,
            loaders:['style-loader','css-loader','sass-loader']
        }
        ....
    }
}

3.页面中使用

<template>
    <div>
        <p></p>
    </div>
</template>
<style lang = 'scss'>
    div{
        p{
            width:100px;
            height:100px;
            color:#ff2020;
        }
    }
</style>

posted @ 2018-06-04 23:41 我在等风也等你啊 阅读( ...) 评论( ...) 编辑 收藏