vue项目中使用sass自适应屏幕

1.用npm/cnpm/yarn安装sass的依赖包

npm install --save-dev sass-loader

npm install --save-dev node-sass

2.在项目中放静态文件的地方新建一个sass文件夹

3.sass文件夹下新建base.scss文件，下面是base文件代码

$old: 75px;

$c-33: #333;

$c-999: #999;

$c-red: #FC5A65;

@function calculateSize($px) {

@return ($px/$old) * 1rem;

}

4.在vue页面中引入base.scss

@import “…/…/assets/sass/base.scss”;(style标签内引入）

5.如上图所示使用calculateSize（）方法转换达到屏幕适配。

（只是其中一种简单写法，仅作参考）