Skip to content
This repository has been archived by the owner on Sep 15, 2021. It is now read-only.

Commit

Permalink
[MAJOR]: Removed deprecated npm-sass and added dart-sass.
Browse files Browse the repository at this point in the history
* Removed npm-sass, added dart-sass, migrated dependecy logic from npm-sass
* Fixed a bunch of lint issues in the imported npm-sass code
* Fixed issue with sass imports within node_modules folder
* Amended fix as per conversation with team, also added extra logging
  • Loading branch information
MCrawleyHomeOffice authored Jul 6, 2021
1 parent 2ca9f95 commit 6420cdd
Show file tree
Hide file tree
Showing 8 changed files with 186 additions and 3 deletions.
29 changes: 29 additions & 0 deletions helpers/importer.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,29 @@
const local = require('./local');
const resolve = require('./resolver');

module.exports = function (options) {
const importerOptions = options || {};

function importer(url, file, done) {
let importerUrl = url;
if (importerOptions.aliases && importerOptions.aliases[importerUrl]) {
importerUrl = importerOptions.aliases[importerUrl];
}

local(importerUrl, file, function (err, isLocal) {
if (err || isLocal) {
done({ file: importerUrl });
} else {
resolve(importerUrl, file)
.catch(function () { return importerUrl; })
.then(function (path) {
const importerPath = path.replace(/\.css$/, '');
return { file: importerPath };
})
.then(done);
}
});
}

return importer;
};
35 changes: 35 additions & 0 deletions helpers/local.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,35 @@
const path = require('path');
const glob = require('glob');

module.exports = function (url, file, done) {
// if url starts with . or / then assume it's a local/relative path
if (['.', path.sep].indexOf(url.substr(0, 1)) > -1) {
return done(null, true);
}

// otherwise construct a glob to match possible relative file paths
const basedir = path.dirname(file);

const bits = url.split(path.sep);

let filename = bits.pop();
const filepath = bits.join(path.sep);

// support _ prefixing of filenames
if (filename[0] !== '_') {
filename = '?(_)' + filename;
}

// match .scss, .sass or .css if the extension is not defined
if (filename.indexOf('.') === -1) {
filename += '.@(sa|c|sc)ss';
}

const target = path.join(basedir, filepath, filename);

// test the constructed glob against the file system for possible matches
glob(target, function (err, list) {
done(err, list.length);
});
return null;
};
16 changes: 16 additions & 0 deletions helpers/resolver.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
const Package = require('./resolver/package');
const Import = require('./resolver/import');
const nearestPackageRoot = require('./resolver/nearest-package-root');

module.exports = function (importUrl, importOriginPath) {
const _import = new Import(importUrl);

return nearestPackageRoot(_import.packageName(), importOriginPath).then(function (packageRoot) {
const _package = new Package(packageRoot);

if (_import.isEntrypoint()) {
return _package.fullPathToEntrypoint();
}
return _package.root(_import.specifiedFilePath());
});
};
32 changes: 32 additions & 0 deletions helpers/resolver/import.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,32 @@
const path = require('path');

function Import(importUrl) {
this.importUrl = importUrl;
}

Import.prototype.isScoped = function () {
return this.importUrl[0] === '@';
};

Import.prototype.packageName = function () {
if (this.isScoped()) {
return this.importUrl.split(path.sep, 2).join(path.sep);
}
return this.importUrl.split(path.sep, 1)[0];
};

Import.prototype.isEntrypoint = function () {
const safePathSplitPattern = new RegExp(path.sep + '.');
const pathSegmentCount = this.importUrl.split(safePathSplitPattern).length;

if (this.isScoped()) {
return pathSegmentCount === 2;
}
return pathSegmentCount === 1;
};

Import.prototype.specifiedFilePath = function () {
return this.importUrl.slice(this.packageName().length);
};

module.exports = Import;
32 changes: 32 additions & 0 deletions helpers/resolver/nearest-package-root.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,32 @@
const path = require('path');
const findup = require('findup');

/**
* @param {string} importOriginPath Path of file that made @import reference
*/
module.exports = function (packageName, importOriginPath) {
const pathToFind = path.join('node_modules', packageName, 'package.json');
const dirnameOfImportOrigin = path.dirname(importOriginPath);
let handleFoundPath;

const promise = new Promise(function (resolve, reject) {
handleFoundPath = function (err, nearestPackageParent) {
if (err) {
try {
return resolve(path.dirname(require.resolve(`${packageName}/package.json`)));
} catch (e) {
console.log(`Failed to find module ${packageName}/package.json for ${importOriginPath}`, e);
}
return reject(err);
}

const packageJSONLocation = path.join(nearestPackageParent, 'node_modules', packageName);

return resolve(packageJSONLocation);
};
});

findup(dirnameOfImportOrigin, pathToFind, handleFoundPath);

return promise;
};
29 changes: 29 additions & 0 deletions helpers/resolver/package.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,29 @@
const path = require('path');

function Package(rootPath) {
this.root = path.join.bind(null, rootPath);
this.JSON = require(this.root('package.json'));
}

Package.prototype.fullPathToEntrypoint = function () {
return this.root(this.entrypoint());
};

Package.prototype.entrypoint = function () {
if (this.JSON.sass) {
return this.JSON.sass;
// look for "style" declaration in package.json
} else if (this.JSON.style) {
return this.JSON.style;
// look for "styles" declaration in package.json
} else if (this.JSON.styles) {
return this.JSON.styles;
// look for a css/sass/scss file in the "main" declaration in package.json
} else if (/\.(sa|c|sc)ss$/.test(this.JSON.main)) {
return this.JSON.main;
// otherwise assume ./styles.scss
}
return 'styles';
};

module.exports = Package;
3 changes: 2 additions & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -28,14 +28,15 @@
"cp": "^0.2.0",
"dotenv": "^4.0.0",
"duplexify": "^3.5.0",
"findup": "^0.1.5",
"hof-transpiler": "^2.0.2",
"lodash.merge": "^4.6.0",
"lodash.throttle": "^4.1.1",
"lodash.uniq": "^4.5.0",
"minimatch": "^3.0.3",
"minimist": "^1.2.0",
"mkdirp": "^0.5.1",
"npm-sass": "^2.2.1",
"sass": "^1.35.1",
"uglify-js": "^2.8.22",
"witch": "^1.0.0"
},
Expand Down
13 changes: 11 additions & 2 deletions tasks/sass/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,8 @@

const fs = require('fs');
const path = require('path');
const sass = require('npm-sass');
const sass = require('sass');
const importer = require('../../helpers/importer');

const mkdir = require('../../lib/mkdir');

Expand All @@ -17,9 +18,17 @@ module.exports = config => {
.then(() => new Promise((resolve, reject) => {
const aliases = {};
if (config.theme) {
console.log('Applying theme: ' + config.theme);
aliases.$$theme = `hof-theme-${config.theme}`;
}
sass(config.sass.src, { aliases }, (err, result) => err ? reject(err) : resolve(result.css));

sass.render({
file: config.sass.src,
importer: importer({ aliases }),
aliases
}, function (err, result) {
err ? reject(err) : resolve(result.css);
});
}))
.then(css => new Promise((resolve, reject) => {
fs.writeFile(out, css, err => err ? reject(err) : resolve());
Expand Down

0 comments on commit 6420cdd

Please sign in to comment.