nerijusgood
nerijusgood

Reputation: 321

Is it possible to convert whole folder with convert-sass? (scss to sass)

I have a bunch of files in bunch of folders in SCSS format. I need to convert it all to SASS format, and I know sass has a specific command for that convert-sass, however I am not sure whether it is possible to convert whole folder (with folders inside)?

If its possible, then how convert-sass, else maybe there is a compiler who is able to do that? Thank you upfront:)

Upvotes: 7

Views: 4068

Answers (2)

Frank N
Frank N

Reputation: 10396

Here's a slighly more extensive answer:

  1. go to your project subfolder, under which all your styles sit (also, because you want to leave node_modules alone, do you?)

    cd frontend/src

  2. convert in place, as said (consider --indent 4 if that's your indentation style...)

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

  3. you almost certainly want to rename all those .scss files to .sass (details)

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

  4. In your .js or .jsx files, you want to adjust your import statements.

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

    More specifically, only your local import statements, starting with a '.', not your global imports, i.e. pointing to node_modules… right?

    Testcase:

    import './style.scss' // should change to .sass
    import './bar.scss'   // should change to .sass
    import 'slick-carousel/slick/slick.scss' // leave me alone!
    

Remaining pitfalls are:

  • Your webpack.configs (loaders!), grunt or gulpfile, still matching against .sass
  • global ‘common’ imports which you might prepend…

Upvotes: 1

Steve Sanders
Steve Sanders

Reputation: 8651

Yes, sass-convert accepts a recursive argument.

If you run sass-convert --help, it will give you a list of available options. One of them is:

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

So, your command should look like this:

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

Upvotes: 19

Related Questions