feat: allow user to choose between resolvers

If a paths property is set in the options, it will effectively disable webpack's resolver. This allows you to use Less' default resolver which is usually faster. However, if you choose to set the paths, you won't be able to use webpack features like resolve.alias or importing other file types.

This is not a breaking change because setting the paths hasn't worked properly before this anyway.

Author: jhnns

src/getOptions.js

@@ -18,8 +18,11 @@ function getOptions(loaderContext) {
   // We need to set the filename because otherwise our WebpackFileManager will receive an undefined path for the entry
   options.filename = loaderContext.resource;
 
-  // It's safe to mutate the array now because it has already been cloned
-  options.plugins.push(createWebpackLessPlugin(loaderContext));
+  // When no paths are given, we use the webpack resolver
+  if ('paths' in options === false) {
+    // It's safe to mutate the array now because it has already been cloned
+    options.plugins.push(createWebpackLessPlugin(loaderContext));
+  }
 
   return options;
 }

test/fixtures/less/error.less …ures/less/error-import-not-existing.lesstest/fixtures/less/error.less renamed to test/fixtures/less/error-import-not-existing.less test/fixtures/less/error.less renamed to test/fixtures/less/error-import-not-existing.less

@@ -0,0 +1,3 @@
+// You can't use include paths and webpack's resolver simulatenously.
+@import "some/module.less";
+@import "~some/module.less";

test/fixtures/less/error-mixed-resolvers.less

@@ -0,0 +1,3 @@
+// some/module.less is intended to be loaded from node_modules if the folder is configured as include path.
+// webpack would expect this import to be prepended with a ~ character.
+@import "some/module.less";

test/fixtures/less/imports-paths.less

@@ -1,18 +1,18 @@
-
-
 const { exec } = require('child_process');
 const fs = require('fs');
 const path = require('path');
 const removeSourceMappingUrl = require('../../src/removeSourceMappingUrl');
 
 const projectPath = path.resolve(__dirname, '..', '..');
-const lessFixtures = path.resolve(__dirname, '..', 'fixtures', 'less');
-const cssFixtures = path.resolve(__dirname, '..', 'fixtures', 'css');
+const fixturesPath = path.resolve(projectPath, 'test', 'fixtures');
+const lessFixturesPath = path.resolve(fixturesPath, 'less');
+const cssFixturesPath = path.resolve(fixturesPath, 'css');
 const matchWebpackImports = /(@import\s+(\([^)]+\))?\s*["'])~/g;
 const lessBin = require.resolve('.bin/lessc');
 const ignore = [
   'non-less-import',
-  'error',
+  'error-import-not-existing',
+  'error-mixed-resolvers',
 ];
 /**
  * This object specifies the replacements for the ~-character per test.
@@ -34,8 +34,11 @@ const lessOptions = {
     `--source-map-basepath=${projectPath}`,
     `--source-map-rootpath=${projectPath}`,
   ],
+  'imports-paths': [
+    `--include-path=${path.resolve(fixturesPath, 'node_modules')}`,
+  ],
 };
-const testIds = fs.readdirSync(lessFixtures)
+const testIds = fs.readdirSync(lessFixturesPath)
   .filter(name =>
     path.extname(name) === '.less' && ignore.indexOf(path.basename(name, '.less')) === -1,
   )
@@ -45,8 +48,8 @@ const testIds = fs.readdirSync(lessFixtures)
 
 testIds
   .forEach((testId) => {
-    const lessFile = path.resolve(lessFixtures, `${testId}.less`);
-    const cssFile = path.resolve(cssFixtures, `${testId}.css`);
+    const lessFile = path.resolve(lessFixturesPath, `${testId}.less`);
+    const cssFile = path.resolve(cssFixturesPath, `${testId}.css`);
     const tildeReplacement = tildeReplacements[testId];
     const originalLessContent = fs.readFileSync(lessFile, 'utf8');
 

test/helpers/createSpec.js

@@ -1,7 +1,10 @@
+const path = require('path');
 const compile = require('./helpers/compile');
 const moduleRules = require('./helpers/moduleRules');
 const { readCssFixture, readSourceMap } = require('./helpers/readFixture');
 
+const nodeModulesPath = path.resolve(__dirname, 'fixtures', 'node_modules');
+
 async function compileAndCompare(fixture, lessLoaderOptions, lessLoaderContext) {
   let inspect;
   const rules = moduleRules.basic(lessLoaderOptions, lessLoaderContext, (i) => {
@@ -28,6 +31,10 @@ test('should resolve all imports from node_modules', async () => {
   await compileAndCompare('imports-node');
 });
 
+test('should resolve imports from given paths', async () => {
+  await compileAndCompare('imports-paths', { paths: [__dirname, nodeModulesPath] });
+});
+
 test('should not try to resolve import urls', async () => {
   await compileAndCompare('imports-url');
 });
@@ -90,9 +97,17 @@ test('should not alter the original options object', async () => {
 });
 
 test('should report error correctly', async () => {
-  const err = await compile('error')
+  const err = await compile('error-import-not-existing')
     .catch(e => e);
 
   expect(err).toBeInstanceOf(Error);
   expect(err.message).toMatch(/not-existing/);
 });
+
+test('should fail if a file is tried to be loaded from include paths and with webpack\'s resolver simultaneously', async () => {
+  const err = await compile('error-mixed-resolvers', moduleRules.basic({ paths: [nodeModulesPath] }))
+    .catch(e => e);
+
+  expect(err).toBeInstanceOf(Error);
+  expect(err.message).toMatch(/'~some\/module\.less' wasn't found/);
+});