-
-
Notifications
You must be signed in to change notification settings - Fork 2.3k
Sass takes excessively long to compile #10122
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
Comments
while trying out my own modified version of here is an example: @use "@sass-fairy/string/string"; parcel will attempt to resolve @forward '@sass-fairy/string'
@forward 'sass:string' hide index so, it will go back to parcel to resolve these.
this seems to entirely be an issue on sass' end, so I'll report it to them.
canonicalize(
url: string,
context: CanonicalizeContext
): PromiseOr<URL | null, sync>; so, it expects |
I'm convinced that this issue has to do with the resolution step: parcel/packages/transformers/sass/src/modern.js Lines 113 to 175 in c2afb4b
specifically, that call to if I add some error logging, then I will see it attempting to resolve 5-10 different files before finally finding the right one. see this comment. |
This issue has something to do with parcel's resolver being extremely slow. if I throw in some The modified code looks like this: let startTime = performance.now();
let endTime;
if (url[0] !== '~') {
for (let p of paths) {
for (let u of urls) {
let filePath = path.resolve(p, u);
let stat;
try {
stat = await asset.fs.stat(filePath);
} catch (err) {
// ignore.
}
if (stat?.isFile()) {
endTime = performance.now();
console.log(`fs resolve took ${endTime - startTime} milliseconds (success)`);
return pathToFileURL(filePath);
}
asset.invalidateOnFileCreate({filePath});
}
}
}
endTime = performance.now();
console.log(`fs resolve took ${endTime - startTime} milliseconds (failure)`);
// If none of the default sass rules apply, try Parcel's resolver.
startTime = performance.now();
for (let u of urls) {
if (NODE_MODULE_ALIAS_RE.test(u)) {
u = u.slice(1);
}
try {
const filePath = await resolve(containingPath, u, {
packageConditions: ['sass', 'style'],
});
endTime = performance.now();
console.log(`parcel resolve took ${endTime - startTime} milliseconds (success)`);
return pathToFileURL(filePath);
} catch (err) {
continue;
}
}
endTime = performance.now();
console.log(`parcel resolve took ${endTime - startTime} milliseconds (failure)`); this will result in log messages that are similar to the following:
you can notice that when it succeeds, it takes only a handful of milliseconds for it to do so. However, when parcel fails to find a match, it will take on the order of seconds. Sass will then try again with a non relative path. this seems to be an issue specifically with parcel's own resolver. However, if I were to simply add the following code at the top of the method: if (url.indexOf("node_modules") > -1)
return null; then it's able to complete almost instantly. @devongovett since you seem to be the person primarily maintaining parcel's resolver, do you have any idea why it would be taking so absurdly long for the resolution when it fails? |
🐛 bug report
Sass takes excessively long to compile, when importing a bunch of sass functions. (not actually sure how long it takes, and it could be infinite. I did not bother to find out and killed it after 5 minutes)
🎛 Configuration (.babelrc, package.json, cli command)
N/A
🤔 Expected Behavior
It doesn't take excessively long to compile.
😯 Current Behavior
It does take excessively long to compile.
💁 Possible Solution
Use the
sass-embedded
instead of thesass
package for@parcel/transformer-sass
.🔦 Context
💻 Code Sample
yarn install -D @sass-fairy/string
🌍 Your Environment
The text was updated successfully, but these errors were encountered: