-
-
Notifications
You must be signed in to change notification settings - Fork 431
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Move importsToResolve to dedicated module
And refactor imperative code in favor of a functional approach
- Loading branch information
Showing
2 changed files
with
51 additions
and
61 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,49 @@ | ||
"use strict"; | ||
|
||
const path = require("path"); | ||
|
||
// libsass uses this precedence when importing files without extension | ||
const extPrecedence = [".scss", ".sass", ".css"]; | ||
|
||
/** | ||
* When libsass tries to resolve an import, it uses a special algorithm. | ||
* Since the sass-loader uses webpack to resolve the modules, we need to simulate that algorithm. This function | ||
* returns an array of import paths to try. | ||
* | ||
* @param {string} request | ||
* @returns {Array} | ||
*/ | ||
function importsToResolve(request) { | ||
// libsass' import algorithm works like this: | ||
// In case there is no file extension... | ||
// - Prefer modules starting with '_'. | ||
// - File extension precedence: .scss, .sass, .css. | ||
// In case there is a file extension... | ||
// - If the file is a CSS-file, do not include it all, but just link it via @import url(). | ||
// - The exact file name must match (no auto-resolving of '_'-modules). | ||
|
||
// Keep in mind: ext can also be something like '.datepicker' when the true extension is omitted and the filename contains a dot. | ||
// @see https://github.com/jtangelder/sass-loader/issues/167 | ||
const ext = path.extname(request); | ||
const basename = path.basename(request); | ||
const dirname = path.dirname(request); | ||
const startsWithUnderscore = basename.charAt(0) === "_"; | ||
// a module import is an identifier like 'bootstrap-sass' | ||
// We also need to check for dirname since it might also be a deep import like 'bootstrap-sass/something' | ||
const isModuleImport = request.charAt(0) !== "." && dirname === "."; | ||
const hasCssExt = ext === ".css"; | ||
const hasSassExt = ext === ".scss" || ext === ".sass"; | ||
|
||
return (isModuleImport && [request]) || // Do not modify module imports | ||
(hasCssExt && []) || // Do not import css files | ||
(hasSassExt && [request]) || // Do not modify imports with explicit extensions | ||
(startsWithUnderscore ? [] : extPrecedence) // Do not add underscore imports if there is already an underscore | ||
.map(ext => "_" + basename + ext) | ||
.concat( | ||
extPrecedence.map(ext => basename + ext) | ||
).map( | ||
file => dirname + "/" + file // No path.sep required here, because imports inside SASS are usually with / | ||
); | ||
} | ||
|
||
module.exports = importsToResolve; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters