Skip to content

Commit

Permalink
fix: Wrong import precedence
Browse files Browse the repository at this point in the history
- Fixes problem with foundation
- Fixes #556
  • Loading branch information
jhnns committed Apr 13, 2018
1 parent 9409e17 commit 03e5f3e
Show file tree
Hide file tree
Showing 9 changed files with 29 additions and 11 deletions.
14 changes: 7 additions & 7 deletions lib/importsToResolve.js
Expand Up @@ -8,7 +8,7 @@ const matchModuleImport = /^~([^\/]+|@[^\/]+[\/][^\/]+)$/g;
/**
* 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. The first entry in the array is always the original url
* returns an array of import paths to try. The last entry in the array is always the original url
* to enable straight-forward webpack.config aliases.
*
* @param {string} url
Expand All @@ -21,7 +21,7 @@ function importsToResolve(url) {
const ext = path.extname(request);

if (matchModuleImport.test(url)) {
return [url, request];
return [request, url];
}

// libsass' import algorithm works like this:
Expand All @@ -33,7 +33,7 @@ function importsToResolve(url) {
return [];
}
if (ext === ".scss" || ext === ".sass") {
return [url, request];
return [request, url];
}

// In case there is no file extension...
Expand All @@ -43,17 +43,17 @@ function importsToResolve(url) {

if (basename.charAt(0) === "_") {
return [
url,
`${ request }.scss`, `${ request }.sass`, `${ request }.css`
`${ request }.scss`, `${ request }.sass`, `${ request }.css`,
url
];
}

const dirname = path.dirname(request);

return [
url,
`${ dirname }/_${ basename }.scss`, `${ dirname }/_${ basename }.sass`, `${ dirname }/_${ basename }.css`,
`${ request }.scss`, `${ request }.sass`, `${ request }.css`
`${ request }.scss`, `${ request }.sass`, `${ request }.css`,
url
];
}

Expand Down
4 changes: 2 additions & 2 deletions test/index.test.js
Expand Up @@ -82,7 +82,7 @@ syntaxStyles.forEach(ext => {
it("should resolve aliases", () => execTest("import-alias", {}, {
resolve: {
alias: {
"path-to-alias": path.join(__dirname, ext, "alias." + ext)
"path-to-alias": path.join(__dirname, ext, "another", "alias." + ext)
}
}
}));
Expand Down Expand Up @@ -205,7 +205,7 @@ describe("sass-loader", () => {
sourceMap.should.not.have.property("file");
sourceMap.should.have.property("sourceRoot", fakeCwd);
// This number needs to be updated if imports.scss or any dependency of that changes
sourceMap.sources.should.have.length(9);
sourceMap.sources.should.have.length(10);
sourceMap.sources.forEach(sourcePath =>
fs.existsSync(path.resolve(sourceMap.sourceRoot, sourcePath))
);
Expand Down
File renamed without changes.
7 changes: 7 additions & 0 deletions test/sass/imports.sass
Expand Up @@ -15,3 +15,10 @@
@import ~animate.css/animate
/* @import url(http://example.com/something/from/the/interwebs); */
@import url(http://example.com/something/from/the/interwebs);
/* scoped import @import language */
.scoped-imporr
@import language
// The local util file should take precedence over Node's util module
// See https://github.com/webpack-contrib/sass-loader/issues/556
/* @import util */
@import util
3 changes: 3 additions & 0 deletions test/sass/util.sass
@@ -0,0 +1,3 @@
// This file has been named "util" on purpose because in a wrong import setup it would conflict with Node's util
.util
color: hotpink
2 changes: 1 addition & 1 deletion test/scss/alias.scss → test/scss/another/alias.scss
@@ -1,3 +1,3 @@
a {
.alias {
color: red;
}
3 changes: 3 additions & 0 deletions test/scss/imports.scss
Expand Up @@ -19,3 +19,6 @@
.scoped-import {
@import "language";
}
// The local util file should take precedence over Node's util module
// See https://github.com/webpack-contrib/sass-loader/issues/556
@import "util";
5 changes: 5 additions & 0 deletions test/scss/util.scss
@@ -0,0 +1,5 @@
// This file has been named "util" on purpose because in a wrong import setup it would conflict with Node's util
// See https://github.com/webpack-contrib/sass-loader/issues/556
.util {
color: hotpink;
}
2 changes: 1 addition & 1 deletion test/tools/createSpec.js
Expand Up @@ -15,7 +15,7 @@ function createSpec(ext) {
const testNodeModules = path.relative(basePath, path.join(testFolder, "node_modules")) + path.sep;
const pathToBootstrap = path.relative(basePath, path.resolve(testFolder, "..", "node_modules", "bootstrap-sass"));
const pathToScopedNpmPkg = path.relative(basePath, path.resolve(testFolder, "node_modules", "@org", "pkg", "./index.scss"));
const pathToFooAlias = path.relative(basePath, path.resolve(testFolder, ext, "./alias." + ext));
const pathToFooAlias = path.relative(basePath, path.resolve(testFolder, ext, "another", "alias." + ext));

fs.readdirSync(path.join(testFolder, ext))
.filter((file) => {
Expand Down

0 comments on commit 03e5f3e

Please sign in to comment.