vue中scss的用法

技术

1.在src文件夹里面新建assets文件夹

2.在asstes文件夹里面新建css文件夹

3.在css文件夹里面新建mixin.scss和reset.scss,如下图

1559552441130

4.在app.vue的mounted里面写

1
2
3
4
5
6
7
mounted(){
    	// 设置html的font-size
document.addEventListener("DOMContentLoaded", function() {
    const html = document.querySelector("html");
    html.style.fontSize = window.innerWidth / 10 + "px";
});
}

5.用法

哪个页面需要，就在哪个页面引入reset.scss

1
2
3
4
5
6
7
8
9
<style lang="scss" scoped>
	@import "../assets/css/reset.scss";
 	.status {
        position: absolute;
        width: rem(690);
        left: 5%;
        top: 3%;
	}
</style>

assets源码链接