diff --git a/packages/bundler/src/commands/inline.js b/packages/bundler/src/commands/inline.js index 141b5b15fb75..7071b04ac617 100644 --- a/packages/bundler/src/commands/inline.js +++ b/packages/bundler/src/commands/inline.js @@ -11,7 +11,9 @@ const fs = require('fs-extra'); const klaw = require('klaw-sync'); const os = require('os'); const path = require('path'); +const isWin = process.platform === 'win32'; const replace = require('replace-in-file'); +const { reporter } = require('@carbon/cli-reporter'); const tmpDir = os.tmpdir(); @@ -24,12 +26,14 @@ async function inline(options, info) { await Promise.all([fs.remove(inlineFolder), fs.remove(vendorFolder)]); + reporter.info('Inlining sass dependencies'); await inlineSassDependencies( packageJsonPath, sourceFolder, vendorFolder, cwd ); + reporter.success('Done'); } async function inlineSassDependencies( @@ -50,8 +54,9 @@ async function inlineSassDependencies( ]; const inlinedDependencies = (await Promise.all( allPossibleDependencies.map(async dependency => { - const [packageFolder, scssFolder] = await findSassModule(dependency, cwd); - if (packageFolder) { + const modules = await findSassModule(dependency, cwd); + if (modules) { + const [scssFolder] = modules; const dependencyOutputFolder = path.join(vendorFolder, dependency); await fs.copy(scssFolder, dependencyOutputFolder); @@ -84,11 +89,7 @@ async function inlineSassDependencies( return false; } - if (path.basename(src) === 'index.scss') { - return false; - } - - return true; + return path.basename(src) !== 'index.scss'; }, }); await fs.copy(tmpFolder, inlineFolder); @@ -113,7 +114,9 @@ async function inlineSassDependencies( files: file.path, from: REPLACE_REGEX, to(_, match) { - return `@import '${relativeImportPath}/${match}`; + return `@import '${ + isWin ? relativeImportPath.replace('\\', '/') : relativeImportPath + }/${match}`; }, }); }) @@ -123,20 +126,20 @@ async function inlineSassDependencies( function findSassModule(packageName, cwd) { let currentDirectory = cwd; - while (currentDirectory !== '/') { + while (currentDirectory !== path.dirname(currentDirectory)) { const nodeModulesFolder = path.join(currentDirectory, 'node_modules'); const packageFolder = path.join(nodeModulesFolder, packageName); const scssFolder = path.join(packageFolder, 'scss'); const packageJsonPath = path.join(packageFolder, 'package.json'); if (fs.existsSync(scssFolder)) { - return [packageFolder, scssFolder, packageJsonPath]; + return [scssFolder, packageFolder, packageJsonPath]; } currentDirectory = path.dirname(currentDirectory); } - return [false]; + return false; } module.exports = inline; diff --git a/packages/elements/tasks/build.js b/packages/elements/tasks/build.js index 043dec4fd0f4..f90b1930b64c 100644 --- a/packages/elements/tasks/build.js +++ b/packages/elements/tasks/build.js @@ -40,7 +40,7 @@ async function build() { const paths = klaw(BUNDLE_DIR, { nodir: true, filter(item) { - const paths = item.path.split('/'); + const paths = item.path.split(path.sep); const filename = paths[paths.length - 1]; const folder = paths[paths.length - 3]; diff --git a/packages/icon-build-helpers/src/builders/react/builder.js b/packages/icon-build-helpers/src/builders/react/builder.js index d92fe9e62c82..f2bf12643a9e 100644 --- a/packages/icon-build-helpers/src/builders/react/builder.js +++ b/packages/icon-build-helpers/src/builders/react/builder.js @@ -8,6 +8,7 @@ 'use strict'; const { camel } = require('change-case'); +const { reporter } = require('@carbon/cli-reporter'); const fs = require('fs-extra'); const path = require('path'); const { rollup } = require('rollup'); @@ -71,6 +72,7 @@ ${modules.map(({ source }) => `export ${source}`).join('\n')} export { Icon }; `; + reporter.info('Building components'); const bundle = await rollup({ input: '__entrypoint__.js', external, @@ -106,6 +108,7 @@ export { Icon }; }) ); + reporter.info('Creating aliases'); // Create aliases for `@carbon/icons-react/es//` await Promise.all( meta.map(async icon => { @@ -114,7 +117,7 @@ export { Icon }; // The length of this is determined by the number of directories from // our `outputOptions` minus 1 for the bundle type (`es` for example) // and minus 1 for the filename as it does not count as a directory jump - length: outputOptions.file.split('/').length - 2, + length: outputOptions.file.split(path.sep).length - 2, }) .fill('..') .join('/'); @@ -141,7 +144,7 @@ export default ${moduleName}; // Drop the first part of `outputOptions.file` as it contains the `es/` // directory const commonjsFilepath = outputOptions.file - .split('/') + .split(path.sep) .slice(1) .join('/'); const { source: component } = createIconComponent(moduleName, descriptor); @@ -165,6 +168,7 @@ export default ${moduleName};`; }; }, {}); + reporter.info('Bundling Javascript modules'); // Using the mapping of file path to file source, we can specify our input to // rollup by formatting the filepath so that rollup outputs the file to the // correct place. The location is going to match the key that we use in the @@ -200,6 +204,7 @@ export default ${moduleName};`; ], }); + reporter.info('Writing to destination'); await commonjsBundles.write({ dir: 'lib', format: 'cjs', diff --git a/packages/icon-build-helpers/src/builders/vanilla/builder.js b/packages/icon-build-helpers/src/builders/vanilla/builder.js index 39eab6b8e36b..74e64575742c 100644 --- a/packages/icon-build-helpers/src/builders/vanilla/builder.js +++ b/packages/icon-build-helpers/src/builders/vanilla/builder.js @@ -209,13 +209,16 @@ async function builder(source, { cwd } = {}) { function getModuleName(name, size, prefixParts, descriptor) { const width = parseInt(descriptor.attrs.width, 10); const height = parseInt(descriptor.attrs.height, 10); - const prefix = prefixParts + let prefix = prefixParts .filter(size => isNaN(size)) .map(pascal) .join(''); const isGlyph = width < 16 || height < 16; if (prefix !== '') { + if (prefix.match(/^\d/)) { + prefix = '_' + prefix; + } if (!size) { if (isGlyph) { return prefix + pascal(name) + 'Glyph'; diff --git a/packages/icons-vue/tasks/build.js b/packages/icons-vue/tasks/build.js index 5454523405b2..e371b05c0a82 100644 --- a/packages/icons-vue/tasks/build.js +++ b/packages/icons-vue/tasks/build.js @@ -8,10 +8,12 @@ 'use strict'; const meta = require('@carbon/icons/build-info.json'); +const { reporter } = require('@carbon/cli-reporter'); const { rollup } = require('rollup'); const babel = require('rollup-plugin-babel'); const virtual = require('./plugins/virtual'); const { createIconComponent } = require('./createIconComponent'); +const isWin = process.platform === 'win32'; const BUNDLE_FORMATS = [ { @@ -46,11 +48,14 @@ const babelConfig = { * building icon components built on top of the `` primitive in `src`. */ async function build() { + reporter.info('Creating components'); const modules = meta.map(icon => { const { source } = createIconComponent(icon.moduleName, icon.descriptor); return { moduleName: icon.moduleName, - filepath: icon.outputOptions.file.replace(/^es\//g, '').slice(0, -3), + filepath: icon.outputOptions.file + .replace(isWin ? /^es\\/g : /^es\//g, '') + .slice(0, -3), source, }; }); @@ -64,6 +69,7 @@ async function build() { }, }`; + reporter.info('Bundling may take a while...'); const bundle = await rollup({ input: { index: '__entrypoint__.js', @@ -91,6 +97,7 @@ async function build() { ], }); + reporter.info('Writing out to files'); await Promise.all( BUNDLE_FORMATS.map(({ format, dir }) => { return bundle.write({ @@ -101,7 +108,11 @@ async function build() { ); } -build().catch(error => { - // eslint-disable-next-line no-console - console.error(error); -}); +build() + .then(() => { + reporter.success('Done!'); + }) + .catch(error => { + // eslint-disable-next-line no-console + console.error(error); + });