importsToResolve.js 2.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960
  1. "use strict";
  2. const path = require("path");
  3. const utils = require("loader-utils");
  4. const matchModuleImport = /^~([^\/]+|@[^\/]+[\/][^\/]+)$/;
  5. /**
  6. * When libsass tries to resolve an import, it uses a special algorithm.
  7. * Since the sass-loader uses webpack to resolve the modules, we need to simulate that algorithm. This function
  8. * returns an array of import paths to try. The last entry in the array is always the original url
  9. * to enable straight-forward webpack.config aliases.
  10. *
  11. * @param {string} url
  12. * @returns {Array<string>}
  13. */
  14. function importsToResolve(url) {
  15. const request = utils.urlToRequest(url);
  16. // Keep in mind: ext can also be something like '.datepicker' when the true extension is omitted and the filename contains a dot.
  17. // @see https://github.com/webpack-contrib/sass-loader/issues/167
  18. const ext = path.extname(request);
  19. if (matchModuleImport.test(url)) {
  20. return [request, url];
  21. }
  22. // libsass' import algorithm works like this:
  23. // In case there is a file extension...
  24. // - If the file is a CSS-file, do not include it all, but just link it via @import url().
  25. // - The exact file name must match (no auto-resolving of '_'-modules).
  26. if (ext === ".css") {
  27. return [];
  28. }
  29. if (ext === ".scss" || ext === ".sass") {
  30. return [request, url];
  31. }
  32. // In case there is no file extension...
  33. // - Prefer modules starting with '_'.
  34. // - File extension precedence: .scss, .sass, .css.
  35. const basename = path.basename(request);
  36. if (basename.charAt(0) === "_") {
  37. return [
  38. `${ request }.scss`, `${ request }.sass`, `${ request }.css`,
  39. url
  40. ];
  41. }
  42. const dirname = path.dirname(request);
  43. return [
  44. `${ dirname }/_${ basename }.scss`, `${ dirname }/_${ basename }.sass`, `${ dirname }/_${ basename }.css`,
  45. `${ request }.scss`, `${ request }.sass`, `${ request }.css`,
  46. url
  47. ];
  48. }
  49. module.exports = importsToResolve;