SCSS加载器与webpack

Question

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

Answer 1

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

直接从谷歌的第一个结果进行这样的搜索:

最常用的语法称为"SCSS"(用于"Sassy CSS"),并且是CSS3语法的超集.这意味着每个有效的CSS3样式表也是有效的SCSS.SCSS文件使用扩展名.scss.第二个较旧的语法称为缩进语法(或仅称为".sass").

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

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

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

如果您使用.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