是否可以使用convert-sass转换整个文件夹? (scss to sass)

时间:2014-10-21 17:54:19

标签: css sass

我在SCSS格式的一堆文件夹中有一堆文件。我需要将它全部转换为SASS格式,我知道sass有一个针对convert-sass的特定命令,但是我不确定是否可以转换整个文件夹(里面有文件夹)?

如果可能,那么如何转换sass,否则可能有一个编译器能够做到这一点?先谢谢你:))

2 个答案:

答案 0 :(得分:15)

是的,sass-convert接受递归参数。

如果您运行sass-convert --help,它会为您提供可用选项列表。其中之一是:

-R, --recursive      Convert all the files in a directory. Requires --from and --to.

因此,您的命令应如下所示:

sass-convert -R my_sass_dir --from sass --to scss

答案 1 :(得分:1)

这是一个更广泛的答案:

  1. 转到你的项目子文件夹,你的所有样式都在其下(另外,因为你想单独留下node_modules,不是吗?)

    cd frontend/src

  2. 按原样转换(考虑--indent 4,如果这是你的缩进风格......)

    sass-convert -R . --from scss --to sass --in-place

  3. 您几乎肯定希望将所有.scss文件重命名为.sass (details)

    find . -name '*.scss' -exec sh -c 'mv "$0" "${0%.scss}.sass"'

  4. 在.js或.jsx文件中,您要调整导入语句。

    find . -name '*.jsx' -print0 | xargs -0 sed -i "s/'\.\(.*\)\.scss'/'.\1.sass'/g"

    更具体地说,只有本地导入语句,以' .'开头,而不是全局导入,即指向到node_modules ......对吗?

    <强>测试用例:

    import './style.scss' // should change to .sass
    import './bar.scss'   // should change to .sass
    import 'slick-carousel/slick/slick.scss' // leave me alone!
    
  5. 剩下的陷阱是:

    • 你的webpack.config s(加载器!),grunt或gulpfile,仍与.sass匹配
    • 您可能会介绍的全球'普通'进口......