Skip to content

Commit

Permalink
refactor: first resolve filename in less, then in webpack (#340)
Browse files Browse the repository at this point in the history
BREAKING CHANGE: some resolutions can be changed
  • Loading branch information
cap-Bernardito authored Apr 21, 2020
1 parent 82cb6a7 commit 443bd5a
Show file tree
Hide file tree
Showing 3 changed files with 35 additions and 57 deletions.
77 changes: 32 additions & 45 deletions src/createWebpackLessPlugin.js
Original file line number Diff line number Diff line change
@@ -1,14 +1,9 @@
import { promisify } from 'util';

import less from 'less';

import { urlToRequest } from 'loader-utils';

/* eslint-disable class-methods-use-this */

const stringifyLoader = require.resolve('./stringifyLoader.js');
const trailingSlash = /[/\\]$/;
const isLessCompatible = /\.(le|c)ss$/;

// This somewhat changed in Less 3.x. Now the file name comes without the
// automatically added extension whereas the extension is passed in as `options.ext`.
Expand All @@ -23,11 +18,6 @@ const isModuleName = /^~[^/\\]+$/;
* @returns {LessPlugin}
*/
function createWebpackLessPlugin(loaderContext) {
const { fs } = loaderContext;

const loadModule = promisify(loaderContext.loadModule.bind(loaderContext));
const readFile = promisify(fs.readFile.bind(fs));

const resolve = loaderContext.getResolve({
mainFields: ['less', 'style', 'main', '...'],
mainFiles: ['_index', 'index', '...'],
Expand All @@ -40,7 +30,6 @@ function createWebpackLessPlugin(loaderContext) {
return false;
}

// Our WebpackFileManager handles all the files
return true;
}

Expand All @@ -61,6 +50,20 @@ function createWebpackLessPlugin(loaderContext) {
return filename;
}

async resolveFilename(filename, currentDirectory, options) {
const url = this.getUrl(filename, options);

const moduleRequest = urlToRequest(
url,
url.charAt(0) === '/' ? '' : null
);

// Less is giving us trailing slashes, but the context should have no trailing slash
const context = currentDirectory.replace(trailingSlash, '');

return this.resolveRequests(context, [moduleRequest, url]);
}

resolveRequests(context, possibleRequests) {
if (possibleRequests.length === 0) {
return Promise.reject();
Expand All @@ -81,50 +84,34 @@ function createWebpackLessPlugin(loaderContext) {
});
}

async loadFile(filename, currentDirectory, options, ...args) {
const url = this.getUrl(filename, options);

const moduleRequest = urlToRequest(
url,
url.charAt(0) === '/' ? '' : null
);

// Less is giving us trailing slashes, but the context should have no trailing slash
const context = currentDirectory.replace(trailingSlash, '');
let resolvedFilename;
async loadFile(filename, ...args) {
let result;

try {
resolvedFilename = await this.resolveRequests(context, [
moduleRequest,
url,
]);
result = await super.loadFile(filename, ...args);
} catch (error) {
loaderContext.emitError(error);
if (error.type !== 'File') {
loaderContext.emitError(error);

return super.loadFile(filename, currentDirectory, options, ...args);
}
return Promise.reject(error);
}

try {
result = await this.resolveFilename(filename, ...args);
} catch (e) {
loaderContext.emitError(e);

loaderContext.addDependency(resolvedFilename);
return Promise.reject(error);
}

if (isLessCompatible.test(resolvedFilename)) {
const fileBuffer = await readFile(resolvedFilename);
const contents = fileBuffer.toString('utf8');
loaderContext.addDependency(result);

return {
contents,
filename: resolvedFilename,
};
return super.loadFile(result, ...args);
}

const loadedModule = await loadModule(
[stringifyLoader, resolvedFilename].join('!')
);
const contents = JSON.parse(loadedModule);
loaderContext.addDependency(result.filename);

return {
contents,
filename: resolvedFilename,
};
return result;
}
}

Expand Down
12 changes: 0 additions & 12 deletions src/stringifyLoader.js

This file was deleted.

3 changes: 3 additions & 0 deletions test/fixtures/less/folder/some.file
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
.some-file {
background: hotpink;
}

0 comments on commit 443bd5a

Please sign in to comment.