那如果使用低版本的vue.cli是不是就可以解决问题了

屏幕大小发生变化，然后就会根据当前屏幕的宽度来计算px

找到问题了，只要sass-loader安装一个版本第一点的就行了，我这里安装了7.3.1的

npm install sass-loader@7.3.1 --save-dev

$px 这个是参数，$fontSize是设置根元素的fontsize默认值，你自己可以设置成20或者30都可以。

例子：设置$fontSize为20，然后$px设置参数10 { px2rem(10) }，就会变成这样：( 10/20 ) +rem  

最后等于：0.5rem

用webstorm就好了。我觉得还是webstorm好用

global.sass 里面的center少了()，改成这样就可以了。

@mixin center() {

    display: flex;

    justify-content: center;

    align-items: center;

}

global.scss中引用了reset.scss，检查这个文件是否存在

你好，建议把node_modules文件夹删除后重试

原来没写分号，不写分号惯了，突然有点不习惯

你好，global.scss中设定了：

$ratio: 375 / 10;

@function px2rem($px) {
  @return $px / $ratio + rem;
}

这里$ratio值的设定是由用户决定的，可以根据自己的实际需要（或者UI设计稿）进行修改

这个值决定了px2rem输出的结果，如果设定为37.5，那么px2rem(20)，表示在375px宽度的屏幕下，显示为20px，计算方法如下：

第一步：375px宽度的屏幕，1rem=37.5px（因为在App.vue中指定了html的font-size=375px/10=37.5px，所以1rem=37.5px）

第二步：计算px2rem(20)=(20/37.5)rem

第三步：将rem转化为px：(20/37.5) * 1rem = 20/37.5 * 37.5px = 20px

如果屏幕为414px，那么px2rem(20)的计算结果为：

px2rem(20)=(20/37.5)*41.4px=22.08px

从而实现了自适应布局，因为px2rem(20)会随屏幕宽度放大或缩小，这是一道数学题

直接输出结论：

1、$ratio的值可以由用户随意设定

2、当设置为37.5时，表示以屏幕宽度375px为基准

3、如果屏幕宽度大于375px，使用px2rem()方法计算出的值会等比例扩大

4、如果屏幕宽度小于375px，使用px2rem()方法计算出的值会等比例缩小

你好，font-size的默认值不是37.5，而是动态计算出来的，计算公式为：屏幕宽度/10，如果屏幕宽度为400px，那么font-size为40px，从而实现了自适应布局，为了美观，所以可以考虑设置一个font-size的上线，否则会字体过大的情况，通常建议上限设置到50-60px就可以了