SASS 变量在 .scss 文件中不起作用

Question

我在使用 sass 变量时遇到问题。浏览器告诉我我正在使用无效的属性值，我可以看到代码编辑器没有选择我正在使用的变量，因为它没有为它们着色。

我已经卸载并重新安装了 sass 和 gulp-sass 但这并没有解决问题，而且我没有想法。我敢肯定这真的很简单。

关键事实
我在 windows 10
我使用 npm install sass
安装了 sass 我使用 npm install gulp-sass
安装了 gulp-sass 我成功地将 .scss 文件编译成 .css 文件
我目前正在尝试在 .scss 文件
中创建变量
这是我的 .scss 文件

$flx: flex;
$clm: column;
$mpage: 1 0 auto;
$space-between: sb;
$pg1: 100vh;

body {
    display: flx;
    min-height: 100vh;
    flex-direction: clm;
  }

  main {
    flex: mpage;
  }

  .item-wrap{
    justify-content: sb;

  }

Answer 1

为了 Sass 读取您的变量，当您调用它们时，您必须在它们前面挂上 $ 字符，就像您在声明它们时所做的那样。

示例：

$flx: flex;
$clm: column;
$mpage: 1 0 auto;
$space-between: sb;
$pg1: 100vh;

body {
    display: $flx;
    min-height: 100vh;
    flex-direction: $clm;
  }

  main {
    flex: $mpage;
  }

  .item-wrap{
    justify-content: $sb;

  }

SASS 变量在 .scss 文件中不起作用

SASS variables are not working in .scss file

sass

gulp