LBRYCommunity/spee.ch
1
0
Fork 0
Code Issues 95 Pull requests 2 Projects Releases 4 Packages Wiki Activity

added dynamic aliasing for custom scss folders

Browse source
This commit is contained in:
bill bittner 2018-08-13 12:36:47 -07:00
parent 0ed5342fd9
commit 392bcf4a5a
4 changed files with 35 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
client/scss/all.scss
View file

@ -2,7 +2,7 @@
@import '_reset'; @import '_reset';
@import '_font'; @import '_font';
@import '_html'; @import '_html';
@import '_body'; @import '~body/_body';
@import '_react-app'; @import '_react-app';
@import '_text'; @import '_text';

0
client/scss/_body.scss → client/scss/body/_body.scss
View file

11
client_custom/scss/body/_body.scss Normal file
View file

@ -0,0 +1,11 @@
body {
background-color: yellow;
margin: 0;
padding: 0;
height: 100%;
word-wrap: break-word;
display: -webkit-flex;
display: flex;
-webkit-flex-direction: column;
flex-direction: column;
}

31
utils/createModuleAliases.js
View file

@ -2,6 +2,7 @@ const { statSync, existsSync, readdirSync } = require('fs');
const { join, resolve } = require('path'); const { join, resolve } = require('path');
const DEFAULT_ROOT = 'client/build'; const DEFAULT_ROOT = 'client/build';
const CUSTOM_ROOT = 'client_custom/build'; const CUSTOM_ROOT = 'client_custom/build';
const CUSTOM_SCSS_ROOT = 'client_custom/scss';
const getFolders = path => { const getFolders = path => {
if (existsSync(path)) { if (existsSync(path)) {
@ -10,14 +11,25 @@ const getFolders = path => {
return []; return [];
}; };
const addAlliasesForFolder = (name, aliasObject) => { // components const addAliasesForCustomComponentFolder = (name, aliasObject) => {
// creates an alias for each component in the folder that is passed to this function
const folderPath = resolve(`${CUSTOM_ROOT}/${name}`); const folderPath = resolve(`${CUSTOM_ROOT}/${name}`);
const components = getFolders(folderPath); const components = getFolders(folderPath);
for (let i = 0; i < components.length; i++) { for (let i = 0; i < components.length; i++) {
let folderName = components[i]; let folderName = components[i];
let aliasName = `@${name}/${folderName}`; let aliasName = `@${name}/${folderName}`;
let aliasPath = resolve(`${CUSTOM_ROOT}/${name}/${folderName}/index.js`); aliasObject[aliasName] = resolve(`${CUSTOM_ROOT}/${name}/${folderName}/index.js`);
aliasObject[aliasName] = aliasPath; }
return aliasObject;
};
const addAlliasesForSCSS = (aliasObject) => { // scss
// creates an alias for every folder found in the custom scss folder
const customScssRoot = resolve(`${CUSTOM_SCSS_ROOT}`);
const customFolders = getFolders(customScssRoot);
for (let i = 0; i < customFolders.length; i++) {
let folderName = customFolders[i];
aliasObject[folderName] = resolve(`${CUSTOM_SCSS_ROOT}/${folderName}`);
} }
return aliasObject; return aliasObject;
}; };
@ -28,12 +40,12 @@ module.exports = () => {
moduleAliases['@config'] = resolve(`config`); moduleAliases['@config'] = resolve(`config`);
moduleAliases['@devConfig'] = resolve(`devConfig`); moduleAliases['@devConfig'] = resolve(`devConfig`);
// create specific aliases for locally defined components // create specific aliases for locally defined components in the following folders
moduleAliases = addAlliasesForFolder('containers', moduleAliases); moduleAliases = addAliasesForCustomComponentFolder('containers', moduleAliases);
moduleAliases = addAlliasesForFolder('components', moduleAliases); moduleAliases = addAliasesForCustomComponentFolder('components', moduleAliases);
moduleAliases = addAlliasesForFolder('pages', moduleAliases); moduleAliases = addAliasesForCustomComponentFolder('pages', moduleAliases);
// default aliases // default component aliases
moduleAliases['@containers'] = resolve(`${DEFAULT_ROOT}/containers`); moduleAliases['@containers'] = resolve(`${DEFAULT_ROOT}/containers`);
moduleAliases['@components'] = resolve(`${DEFAULT_ROOT}/components`); moduleAliases['@components'] = resolve(`${DEFAULT_ROOT}/components`);
moduleAliases['@pages'] = resolve(`${DEFAULT_ROOT}/pages`); moduleAliases['@pages'] = resolve(`${DEFAULT_ROOT}/pages`);
@ -42,6 +54,9 @@ module.exports = () => {
moduleAliases['@sagas'] = resolve(`${DEFAULT_ROOT}/sagas`); moduleAliases['@sagas'] = resolve(`${DEFAULT_ROOT}/sagas`);
moduleAliases['@app'] = resolve(`${DEFAULT_ROOT}/app.js`); moduleAliases['@app'] = resolve(`${DEFAULT_ROOT}/app.js`);
// scss aliases
moduleAliases = addAlliasesForSCSS(moduleAliases);
// return finished aliases // return finished aliases
return moduleAliases; return moduleAliases;
}; };