Skip to content

Commit 0b7fee5

Browse files
author
Adam Hines
committed
fix(sass-imports): resolve module imports relative to file being processed
Currently sass-imports that use the module import syntax (eg. `~module-to-import/some.sass`) are resolved relative to the vue-jest package. If you only have one version of that package, and everything has been hoisted to the same level as vue-jest (or higher), then things work as expected. Where things start to fail is when you have more than one instance of the sass package you are trying to import as it is possible the wrong version will be loaded, and it is concievable that the file won't be found. Where I encountered this problem, we had something like the following: ``` node_modules/ component-library/ node_modules/ sass-library@3.0.0 mixins.sass some-component.vue: <style lang="sass"> @import '~sass-library/mixins.scss'; class foo { @use someMixinFromV3 } </style> sass-library@1.0.0 mixins.sass @vue/vue2-jest lib module-name-mapper-helper.js ``` Notice that "sass-library" v1 was hoisted to the top level, but "component-library" depends on v3 of sass-library so v3 is in a nested node_modules directory. When "@vue/vue2-jest" does `require.resolve('sass-library/mixins.scss')`, while processing `component-library/some-component.vue`, the module search path is relative to the vue2-jest source file and not relative to some-component.vue like you would expect. The end result is that it finds the top-level `sass-library@1.0.0` and not the v3 version. To fix this, I am now passing in the optional "paths" value to require.resolve (available since node 8.9 https://nodejs.org/api/modules.html#requireresolverequest-options) and providing the path to the source file being processed instead. This will start the module resolution search at some-component.vue and the nested `node_modules/sass-library`` v3 will be found instead.
1 parent e218c07 commit 0b7fee5

File tree

2 files changed

+4
-2
lines changed

2 files changed

+4
-2
lines changed

packages/vue2-jest/lib/module-name-mapper-helper.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,7 @@ function resolveSass(to, importPath, fileType) {
3131

3232
for (const filename of filenames) {
3333
try {
34-
return require.resolve(path.join(dirname, filename))
34+
return require.resolve(path.join(dirname, filename), { paths: [to] })
3535
} catch (_) {}
3636
}
3737
}

packages/vue3-jest/lib/module-name-mapper-helper.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,9 @@ function resolve(to, importPath, fileType) {
1414
if (path.isAbsolute(importPath)) {
1515
return importPath
1616
} else if (matchModuleImport.test(importPath)) {
17-
return require.resolve(importPath.replace(matchModuleImport, ''))
17+
return require.resolve(importPath.replace(matchModuleImport, ''), {
18+
paths: [to]
19+
})
1820
}
1921
return path.join(path.dirname(to), importPath)
2022
}

0 commit comments

Comments
 (0)