Skip to content

Scss integration #73

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 7 commits into from
Mar 17, 2018
Merged

Scss integration #73

merged 7 commits into from
Mar 17, 2018

Conversation

btoo
Copy link

@btoo btoo commented Mar 16, 2018

hi @eddyerburgh - thanks for your awesome contributions to the vue ecosystem

i've been needing an scss compiler with this package for a minute now, so i thought i'd go ahead and try adding it myself. to give you an overview of this PR, i

  • refactored a bit of the processStyle function and moved it to its own module
  • added node-sass as a peer dependency
  • added an scss compiler (no support for sass yet)
  • allowed including scss global files via jest global (as recommended here). the format of this feature is inspired by sass-resources-loader
  • updated the README to reflect supported style languages

what do you think?

@btoo btoo force-pushed the scss-integration branch from c9ef9bd to 541ed06 Compare March 16, 2018 18:20
Copy link
Member

@eddyerburgh eddyerburgh left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Great work, thanks so much 😀

There's a couple things. First, we shouldn't add it as a peerdependency, because users that don't use scss won't need node-sass installed. Elsewhere we're using an ensureRequire helper function that throws an error if it isn't installed—https://github.com/vuejs/vue-jest/blob/master/lib/compilers/coffee-compiler.js#L6. Can you remove node-sass as a peerDependency and use ensureRequire.

Secondly, could you move process-styles/index.js to lib/process-style.js. Then move process-style/stylus and process-style/scss to lib/compilers/stylus-compiler and lib/compilers/scss-compiler.

Third, why do we need to rewrite the imports in scss?

This is awesome though, and I'm looking forward to adding SCSS support 😀

Copy link
Member

@eddyerburgh eddyerburgh left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I forgot to click request changes in my previous review.

Also node-sass needs to be added as a devDependency so the tests can use it

@btoo
Copy link
Author

btoo commented Mar 16, 2018

you got it 👌

as for your question about rewriting imports, i've actually copied the functionality almost identically from sass-resources-loader. what we're doing is converting all the sass import paths to absolute paths (starting at the project root) because node-sass is executing the compilation from wherever scss-compiler.js is located, which may change from user to user, rendering relative paths pretty risky. i believe that even if we do decide to keep relative paths in the mix, we'd still have to rewrite the imports such that they are relative to the files doing the importing rather than scss-compiler.js which i am sure is going to be a huge headache to do haha

@btoo btoo force-pushed the scss-integration branch from b0791cf to 633216c Compare March 16, 2018 22:30
Copy link
Member

@eddyerburgh eddyerburgh left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Great work 😀

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants