SCSS加载器与webpack

Question

如何使用webpack构建我的.scss？我可以找到更少的装载机和css装载机，但不能scss。这和Sass一样吗？我一直被引用到Sass但语法不同

Answer 1

这更像是SASS语法与SCSS语法的问题。

直接从google上的第一个结果进行搜索：

  

最常用的语法称为“SCSS”（用于“Sassy CSS”），并且是CSS3语法的超集。这意味着每个有效的CSS3样式表也是有效的SCSS。 SCSS文件使用扩展名.scss。第二种较旧的语法称为缩进语法（或只是“.sass”）。

至于它与webpack中的sass-loader的兼容性 - 最终，sass加载器调用了node-sass库，它本身是在libsass上构建的。

这些工具支持两种语法形式，因此您可以毫无问题地使用sass-loader。

sass-loader使用较旧的.sass语法

如果您使用.sass，则只需在使用sass-loader时在查询字符串上传递一个选项：

loaders: [
  {
    test: /\.sass$/,
    // Passing indentedSyntax query param to node-sass
    loaders: ["style", "css", "sass?indentedSyntax"]
  }
]

使用更常见的.scss语法

sass-loader使用

如果您正在使用.scss，并且已经正确配置了加载程序，那么一切都应该正常工作。

以下是sass-loader的链接供您参考：https://github.com/jtangelder/sass-loader