HBuilderX scss/sass 使用教程

安裝node-sass插件

在HBuilderX中，使用scss/sass是需要安裝node-sass編譯插件的。

點擊菜單【工具】-->【插件安裝】

 

 

如果安裝失敗，請見：http://ask.dcloud.net.cn/article/35468

寫項目的時候 需要在樣式中添加的預處理器  lang="scss"

<style lang="scss">
.diy-wrap {
	height: 100vh;
}
.page-content{
	padding-bottom:55px;
	padding-bottom: calc(55px + constant(safe-area-inset-bottom));
	padding-bottom: calc(55px + env(safe-area-inset-bottom));
}
.page-content.active{
	padding-bottom:90px;
	padding-bottom: calc(90px + constant(safe-area-inset-bottom));
	padding-bottom: calc(90px + env(safe-area-inset-bottom));
}
.index_bg {
	width: 100%;
	height: 100%;
}
<style>