Skip to content
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

Update to major version 5 #802

Merged
merged 22 commits into from
Jun 25, 2021
Merged

Update to major version 5 #802

merged 22 commits into from
Jun 25, 2021

Conversation

mxmason
Copy link
Contributor

@mxmason mxmason commented Jun 14, 2021

Summary

  • Decouplesnode-sass from this module, and requires users to explicitly set a compiler of their choice.
  • Upgrades our out-of-date dependencies (which also requires some minor changes to the test suite).
  • Bumps minimum Node version to 12.

Now that we require users to install their own compilers, it is not strictly necessary for us to bump our minimum Node version, but supporting Node versions that have hit EOL could complicate things in the future. It's worth noting that node-sass has adopted Node 12 as a minimum requirement.

New API

Major version 5 requires users to explicitly set a compiler by passing it to a curried function (per #802 (comment)). Both node-sass and sass compilers are permitted.

For example, in gulpfile.js:

# v4
- const sass = require('gulp-sass');
- const dartSass = require('sass');
- sass.compiler = dartSass;
# v5
+ const sass = require('gulp-sass')(require('sass'));

If the compiler is not set, gulp-sass will throw an error advising the user of this API.

Miscellaneous fixes

These issues relate either to the current version of the project bundling node-sass@4, or to our dependencies currently being outdated.

Issue list

Tasks

  • Move node-sass to dev dependencies; update to version 6
  • Update gulp to major version 4, to support new node-sass
    • Update gulp plugins used for tests
    • Update mocha tests for gulp compatiblity
  • Change API for setting compiler, update tests to match
  • Add new error about setting compiler
  • Update other dependencies not broken by node-sass / Node 12 for better future stability
  • Update readme, changelog
  • Update tests to provide confidence about dart-sass as compiler See Update to major version 5 #802 (comment)

mxmason added 3 commits June 7, 2021 16:05
Also moves node-sass to devDependencies and peerDependencies. This helps prevent dupes and conflicts in packages using gulp-sass
@mxmason mxmason mentioned this pull request Jun 14, 2021
@xzyfer
Copy link
Collaborator

xzyfer commented Jun 15, 2021

Thanks for all this effort. The comment about broad version support was with intention of not needing to bump the major to limit the impact on the ecosystem.

I agree the changes to support versions in node-sass forces our hand here, and we had planned to bump the major in order to make node-sass optional anyway.

index.js Outdated Show resolved Hide resolved
@xzyfer
Copy link
Collaborator

xzyfer commented Jun 15, 2021

Can the previously proposed updates the CONTRIBUTING.md and README.md also be ported into this PR?

@xzyfer
Copy link
Collaborator

xzyfer commented Jun 15, 2021

Additionally, given we're bumping the major and updating the gulp dependencies, are you to confirm whether these proposed README.md make sense to be ported to this PR also?

Apologies I'm not in touch with gulp anymore.

@mxmason
Copy link
Contributor Author

mxmason commented Jun 15, 2021

Thanks for looking at my work! I can give the changes to Readme and Contributing a more thoughtful look tomorrow!

I noticed that the initial API for setting the compiler had users passing an argument, as with gulpSass(compiler). Should I revert to that, or keep the API where users set a compiler prop after defining gulpSass?

@xzyfer
Copy link
Collaborator

xzyfer commented Jun 15, 2021

When I used gulp heavily the gulpSass(compiler) was a common pattern so I'd favour that approach unless there's a strong argument against it. I believe that linked commit is fairly close to feature complete, so I'd suggest taking that a starting point for this work.

Copy link
Contributor Author

@mxmason mxmason left a comment

Choose a reason for hiding this comment

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

Hey @xzyfer! I've made a couple changes, and identified an open concern I'd like your input on. I also updated the PR description to better surface the changes in this PR. There's a tasklist now – please feel free to tell me if I missed something. I hope to come back tomorrow to update the docs.

Two open questions:

  • Should we update the test suite to provide better confidence about Dart Sass? See Update to major version 5 #802 (comment)
  • Should we update other dependencies in this repo that were not broken by node-sass or node 12, just to provide better stability? Edit: I went ahead and updated all our dependencies to the latest supported by node 12

index.js Outdated
Comment on lines 164 to 180
if (!compiler || !compiler.render) {
const message = new PluginError(
PLUGIN_NAME,
'\n' +
'gulp-sass 5 does not have a default Sass compiler; please set one yourself.\n' +
'Both the `sass` and `node-sass` packages are permitted.\n' +

'For example, in your gulpfile:\n\n' +
' var sass = require(\'gulp-sass\')(require(\'sass\'));\n',
{ showProperties: false },
).toString();
process.stderr.write(`${message}\n`);
process.exit(1);
}
gulpSass.compiler = compiler;
return gulpSass;
};
Copy link
Contributor Author

@mxmason mxmason Jun 16, 2021

Choose a reason for hiding this comment

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

🔍 Please let me know if I should implement this API some other way!

Edit: This is outdated because a8de2a0 resulted in some formatting changes, but the implementation is the same.

index.js Show resolved Hide resolved
test/main.js Outdated Show resolved Hide resolved
@mxmason mxmason requested a review from xzyfer June 16, 2021 18:25
@mxmason mxmason changed the title Enable Node 16 support Update to major version 5 Jun 16, 2021
Copy link
Collaborator

@xzyfer xzyfer left a comment

Choose a reason for hiding this comment

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

Fantastic work! I'll try to cut a release in the next couple days once the dust settles from today's gulp-sass and node-sass minor releases.

@mxmason
Copy link
Contributor Author

mxmason commented Jun 24, 2021

Thanks, @xzyfer! I still need to update the docs, and I can do that over the next couple days if you want!

@xzyfer
Copy link
Collaborator

xzyfer commented Jun 24, 2021

Awesome!

@mxmason mxmason requested a review from xzyfer June 25, 2021 07:55
@mxmason
Copy link
Contributor Author

mxmason commented Jun 25, 2021

Hey, @xzyfer I've updated the README file to

  • document the new API
  • provide a short migration guide
  • warn about the EOL of node-fibers (we now suggest switching to renderSync)
  • use examples written for Gulp 4
  • include new badges to provide more info about this package

Here's the rendered markdown.

I have not updated the Changelog yet, as I saw that the Changelog consists mostly of your cut releases, and i can't cut those. Let me know if I should do anything else!

Edit: Don't know why I tagged Dylan Manning in this comment at first; apologies!

README.md Outdated Show resolved Hide resolved
@xzyfer
Copy link
Collaborator

xzyfer commented Jun 25, 2021

Amazing work!

@xzyfer xzyfer merged commit 978b8f6 into dlmanning:master Jun 25, 2021
@mxmason mxmason deleted the feature/update-node-sass branch June 25, 2021 09:42
@cyrilverloop
Copy link

Hi,

Thanks for this update. Is it possible to import this as an ES module ?
Like : import sass from 'gulp-sass';

@mxmason
Copy link
Contributor Author

mxmason commented Jun 26, 2021

Hey @cyrilverloop,

This release can’t be imported as an esmodule. I’m open to working on a release that supports both commonjs and esmodules (if @xzyfer thinks it’d be useful), but that would take a bit of effort.

@xzyfer
Copy link
Collaborator

xzyfer commented Jun 27, 2021 via email

@cyrilverloop
Copy link

I don't know about dart-sass and node-sass, but using import worked in gulp-sass v4.

@cyrilverloop
Copy link

cyrilverloop commented Jun 27, 2021

Can the compiler be defined after the import ?

@mxmason
Copy link
Contributor Author

mxmason commented Jun 27, 2021

I might be wrong about ESM support here! I’ll test it when I’m at my desk. But yes, the compiler can be defined after import.

@mae829
Copy link

mae829 commented Jun 30, 2021

@cyrilverloop not sure you figured it out but this is my implementation after updating to v5

import dartSass from 'sass';
import gulpSass from 'gulp-sass';
const sass = gulpSass( dartSass );

@cyrilverloop
Copy link

@mae829 thanks for the import. Your solution works for me.

I recommend to put it in the documentation.

@mxmason
Copy link
Contributor Author

mxmason commented Jul 1, 2021

Thank you, @mae829! I agree that this should be in the docs and I will make a PR about it soon.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment