diff --git a/src/utils.js b/src/utils.js index 1f97901..696fd18 100644 --- a/src/utils.js +++ b/src/utils.js @@ -400,6 +400,37 @@ async function createEvaluator(loaderContext, code, options) { : path.normalize(resolved); resolvedImportDependencies.set(importPath, result); + + const dependenciesOfImportDependencies = []; + + for (const dependency of isArray ? result.resolved : [result.resolved]) { + dependenciesOfImportDependencies.push( + (async () => { + let dependencyCode; + + try { + dependencyCode = ( + await readFile(loaderContext.fs, dependency) + ).toString(); + } catch (error) { + loaderContext.emitError(error); + } + + await getDependencies( + resolvedDependencies, + loaderContext, + fileResolve, + globResolve, + seen, + dependencyCode, + dependency, + options + ); + })() + ); + } + + await Promise.all(dependenciesOfImportDependencies); }) ); diff --git a/test/__snapshots__/loader.test.js.snap b/test/__snapshots__/loader.test.js.snap index 56ea872..61732bc 100644 --- a/test/__snapshots__/loader.test.js.snap +++ b/test/__snapshots__/loader.test.js.snap @@ -402,6 +402,58 @@ exports[`loader imports files listed in option as glob: errors 1`] = `Array []`; exports[`loader imports files listed in option as glob: warnings 1`] = `Array []`; +exports[`loader imports files listed in options with nested glob import: css 1`] = ` +".a-glob { + color: #000; +} +.b-glob { + background: #808080; +} +.a-glob-webpack { + color: #000; +} +.b-glob-webpack { + background: #808080; +} +.glob-in-node { + color: #fff; +} +.glob-in-node { + background: #ff7f50; +} +.index-glob { + font-size: 1rem; +} +.a-glob { + color: #000; +} +.b-glob { + background: #808080; +} +.a-glob-webpack { + color: #000; +} +.b-glob-webpack { + background: #808080; +} +.glob-entry { + box-sizing: border-box; +} +body { + font: 12px Helvetica, Arial, sans-serif; +} +a.button { + -webkit-border-radius: 5px; + -moz-border-radius: 5px; + border-radius: 5px; +} +" +`; + +exports[`loader imports files listed in options with nested glob import: errors 1`] = `Array []`; + +exports[`loader imports files listed in options with nested glob import: warnings 1`] = `Array []`; + exports[`loader imports files with special characters listed in glob: css 1`] = ` ".directoryfile { color: #f00; @@ -506,6 +558,25 @@ exports[`loader in a nested import load module from webpack: errors 1`] = `Array exports[`loader in a nested import load module from webpack: warnings 1`] = `Array []`; +exports[`loader in a nested import specified in options: css 1`] = ` +".imported-in-web-modules { + font-size: 2em; +} +body { + font: 12px Helvetica, Arial, sans-serif; +} +a.button { + -webkit-border-radius: 5px; + -moz-border-radius: 5px; + border-radius: 5px; +} +" +`; + +exports[`loader in a nested import specified in options: errors 1`] = `Array []`; + +exports[`loader in a nested import specified in options: warnings 1`] = `Array []`; + exports[`loader resolve with webpack if stylus can't find it: css 1`] = ` ".imported-in-web-modules { font-size: 2em; diff --git a/test/loader.test.js b/test/loader.test.js index 2d6a810..535043b 100644 --- a/test/loader.test.js +++ b/test/loader.test.js @@ -435,6 +435,67 @@ describe('loader', () => { expect(getErrors(stats)).toMatchSnapshot('errors'); }); + it('in a nested import specified in options', async () => { + const testId = './basic.styl'; + const compiler = getCompiler( + testId, + { + stylusOptions: { + import: ['shallow-webpack.styl'], + }, + }, + { + resolve: { + modules: [path.join(__dirname, 'fixtures', 'web_modules')], + }, + } + ); + const stats = await compile(compiler); + const codeFromBundle = getCodeFromBundle(stats, compiler); + const codeFromStylus = await getCodeFromStylus(testId, { + stylusOptions: { + import: ['shallow-webpack.styl'], + }, + }); + + expect(codeFromBundle.css).toBe(codeFromStylus.css); + expect(codeFromBundle.css).toMatchSnapshot('css'); + expect(getWarnings(stats)).toMatchSnapshot('warnings'); + expect(getErrors(stats)).toMatchSnapshot('errors'); + }); + + it('imports files listed in options with nested glob import', async () => { + const testId = './basic.styl'; + const compiler = getCompiler( + testId, + { + stylusOptions: { + import: ['import-glob-webpack.styl'], + }, + }, + { + resolve: { + alias: { + globAlias: path.resolve(__dirname, 'fixtures', 'glob-webpack-2'), + globAlias2: path.resolve(__dirname, 'fixtures', 'glob'), + }, + }, + } + ); + const stats = await compile(compiler); + const codeFromBundle = getCodeFromBundle(stats, compiler); + const codeFromStylus = await getCodeFromStylus(testId, { + stylusOptions: { + import: ['import-glob-webpack.styl'], + }, + }); + + expect(codeFromBundle.css).toBe(codeFromStylus.css); + expect(codeFromBundle.css).toMatchSnapshot('css'); + expect(getWarnings(stats)).toMatchSnapshot('warnings'); + expect(getErrors(stats)).toMatchSnapshot('errors'); + }); + it('resolves css with webpack but does not import it', async () => { const testId = './import-webpack-css.styl'; const compiler = getCompiler(testId);