From 68f135bd844c673f1b032a4c9b26238bb5f0eb7b Mon Sep 17 00:00:00 2001 From: Andrew Duthie Date: Mon, 7 Jan 2019 08:16:13 -0500 Subject: [PATCH] Revert "Build: Change package build step to async flow (#8093)" (#13195) This reverts commit 4928f16b7ebdba334e9c6bcd7e0a03c50ad3bde6. --- bin/packages/build.js | 107 ++++++++++++++++++------------------------ package-lock.json | 16 +++++++ package.json | 1 + 3 files changed, 62 insertions(+), 62 deletions(-) diff --git a/bin/packages/build.js b/bin/packages/build.js index cc0bcf5f76ae6..02009c1e4a4d3 100755 --- a/bin/packages/build.js +++ b/bin/packages/build.js @@ -8,15 +8,15 @@ /** * External dependencies */ -const { promisify } = require( 'util' ); const fs = require( 'fs' ); const path = require( 'path' ); -let glob = require( 'glob' ); +const glob = require( 'glob' ); const babel = require( '@babel/core' ); const chalk = require( 'chalk' ); -let mkdirp = require( 'mkdirp' ); +const mkdirp = require( 'mkdirp' ); const sass = require( 'node-sass' ); const postcss = require( 'postcss' ); +const deasync = require( 'deasync' ); /** * Internal dependencies @@ -36,14 +36,6 @@ const BUILD_DIR = { }; const DONE = chalk.reset.inverse.bold.green( ' DONE ' ); -// Promisification -const readFile = promisify( fs.readFile ); -const writeFile = promisify( fs.writeFile ); -const transformFile = promisify( babel.transformFile ); -const renderSass = promisify( sass.render ); -glob = promisify( glob ); -mkdirp = promisify( mkdirp ); - /** * Get the package name for a specified file * @@ -81,8 +73,6 @@ function getBuildPath( file, buildFolder ) { * Given a list of scss and js filepaths, divide them into sets them and rebuild. * * @param {Array} files list of files to rebuild - * - * @return {Promise} Promise resolving when files are built. */ function buildFiles( files ) { // Reduce files into a unique sets of javaScript files and scss packages. @@ -97,10 +87,8 @@ function buildFiles( files ) { return accumulator; }, { jsFiles: new Set(), scssPackagePaths: new Set() } ); - return Promise.all( [ - ...buildPaths.jsFiles.map( buildJsFile ), - ...buildPaths.scssPackagePaths.map( buildPackageScss ), - ] ); + buildPaths.jsFiles.forEach( buildJsFile ); + buildPaths.scssPackagePaths.forEach( buildPackageScss ); } /** @@ -108,39 +96,30 @@ function buildFiles( files ) { * * @param {string} file File path to build * @param {boolean} silent Show logs - * - * @return {Promise} Promise resolving when file is built. */ function buildJsFile( file, silent ) { - return Promise.all( [ - buildJsFileFor( file, silent, 'main' ), - buildJsFileFor( file, silent, 'module' ), - ] ); + buildJsFileFor( file, silent, 'main' ); + buildJsFileFor( file, silent, 'module' ); } /** * Build a package's scss styles * * @param {string} packagePath The path to the package. - * - * @return {Promise} Promise resolving when file is built. */ -async function buildPackageScss( packagePath ) { +function buildPackageScss( packagePath ) { const srcDir = path.resolve( packagePath, SRC_DIR ); - const scssFiles = await glob( `${ srcDir }/*.scss` ); + const scssFiles = glob.sync( `${ srcDir }/*.scss` ); // Build scss files individually. - return Promise.all( scssFiles.map( buildScssFile ) ); + scssFiles.forEach( buildScssFile ); } -async function buildScssFile( styleFile ) { +function buildScssFile( styleFile ) { const outputFile = getBuildPath( styleFile.replace( '.scss', '.css' ), BUILD_DIR.style ); const outputFileRTL = getBuildPath( styleFile.replace( '.scss', '-rtl.css' ), BUILD_DIR.style ); - - await mkdirp( path.dirname( outputFile ) ); - - const contents = await readFile( styleFile, 'utf8' ); - const builtSass = await renderSass( { + mkdirp.sync( path.dirname( outputFile ) ); + const builtSass = sass.renderSync( { file: styleFile, includePaths: [ path.resolve( __dirname, '../../assets/stylesheets' ) ], data: ( @@ -152,22 +131,27 @@ async function buildScssFile( styleFile ) { 'animations', 'z-index', ].map( ( imported ) => `@import "${ imported }";` ).join( ' ' ) + - contents + fs.readFileSync( styleFile, 'utf8' ) ), } ); - const result = await postcss( require( './post-css-config' ) ).process( builtSass.css, { - from: 'src/app.css', - to: 'dest/app.css', - } ); + const postCSSSync = ( callback ) => { + postcss( require( './post-css-config' ) ) + .process( builtSass.css, { from: 'src/app.css', to: 'dest/app.css' } ) + .then( ( result ) => callback( null, result ) ); + }; - const resultRTL = await postcss( [ require( 'rtlcss' )() ] ).process( result.css, { - from: 'src/app.css', - to: 'dest/app.css', - } ); + const postCSSRTLSync = ( ltrCSS, callback ) => { + postcss( [ require( 'rtlcss' )() ] ) + .process( ltrCSS, { from: 'src/app.css', to: 'dest/app.css' } ) + .then( ( result ) => callback( null, result ) ); + }; + + const result = deasync( postCSSSync )(); + fs.writeFileSync( outputFile, result.css ); - await writeFile( outputFile, result.css ); - await writeFile( outputFileRTL, resultRTL.css ); + const resultRTL = deasync( postCSSRTLSync )( result ); + fs.writeFileSync( outputFileRTL, resultRTL ); } /** @@ -177,17 +161,17 @@ async function buildScssFile( styleFile ) { * @param {boolean} silent Show logs * @param {string} environment Dist environment (node or es5) */ -async function buildJsFileFor( file, silent, environment ) { +function buildJsFileFor( file, silent, environment ) { const buildDir = BUILD_DIR[ environment ]; const destPath = getBuildPath( file, buildDir ); const babelOptions = getBabelConfig( environment ); babelOptions.sourceMaps = true; babelOptions.sourceFileName = file; - await mkdirp( path.dirname( destPath ) ); - const transformed = await transformFile( file, babelOptions ); - writeFile( destPath + '.map', JSON.stringify( transformed.map ) ); - writeFile( destPath, transformed.code + '\n//# sourceMappingURL=' + path.basename( destPath ) + '.map' ); + mkdirp.sync( path.dirname( destPath ) ); + const transformed = babel.transformFileSync( file, babelOptions ); + fs.writeFileSync( destPath + '.map', JSON.stringify( transformed.map ) ); + fs.writeFileSync( destPath, transformed.code + '\n//# sourceMappingURL=' + path.basename( destPath ) + '.map' ); if ( ! silent ) { process.stdout.write( @@ -205,9 +189,9 @@ async function buildJsFileFor( file, silent, environment ) { * * @param {string} packagePath absolute package path */ -async function buildPackage( packagePath ) { +function buildPackage( packagePath ) { const srcDir = path.resolve( packagePath, SRC_DIR ); - const jsFiles = await glob( `${ srcDir }/**/*.js`, { + const jsFiles = glob.sync( `${ srcDir }/**/*.js`, { ignore: [ `${ srcDir }/**/test/**/*.js`, `${ srcDir }/**/__mocks__/**/*.js`, @@ -215,15 +199,14 @@ async function buildPackage( packagePath ) { nodir: true, } ); - await Promise.all( [ - // Build js files individually. - ...jsFiles.map( ( file ) => buildJsFile( file, true ) ), + process.stdout.write( `${ path.basename( packagePath ) }\n` ); + + // Build js files individually. + jsFiles.forEach( ( file ) => buildJsFile( file, true ) ); - // Build package CSS files - buildPackageScss( packagePath ), - ] ); + // Build package CSS files + buildPackageScss( packagePath ); - process.stdout.write( `${ path.basename( packagePath ) }\n` ); process.stdout.write( `${ DONE }\n` ); } @@ -233,7 +216,7 @@ if ( files.length ) { buildFiles( files ); } else { process.stdout.write( chalk.inverse( '>> Building packages \n' ) ); - Promise.all( getPackages().map( buildPackage ) ).then( () => { - process.stdout.write( '\n' ); - } ); + getPackages() + .forEach( buildPackage ); + process.stdout.write( '\n' ); } diff --git a/package-lock.json b/package-lock.json index 8d73b5d4671a2..55c478e4e3279 100644 --- a/package-lock.json +++ b/package-lock.json @@ -4556,6 +4556,12 @@ "integrity": "sha512-XBaoWE9RW8pPdPQNibZsW2zh8TW6gcarXp1FZPwT8Uop8ScSNldJEWf2k9l3HeTqdrEwsOsFcq74RiJECW34yA==", "dev": true }, + "bindings": { + "version": "1.2.1", + "resolved": "https://registry.npmjs.org/bindings/-/bindings-1.2.1.tgz", + "integrity": "sha1-FK1hE4EtLTfXLme0ystLtyZQXxE=", + "dev": true + }, "block-stream": { "version": "0.0.9", "resolved": "https://registry.npmjs.org/block-stream/-/block-stream-0.0.9.tgz", @@ -6755,6 +6761,16 @@ "integrity": "sha512-jyCETtSl3VMZMWeRo7iY1FL19ges1t55hMo5yaam4Jrsm5EPL89UQkoQRyiI+Yf4k8r2ZpdngkV8hr1lIdjb3Q==", "dev": true }, + "deasync": { + "version": "0.1.13", + "resolved": "https://registry.npmjs.org/deasync/-/deasync-0.1.13.tgz", + "integrity": "sha512-/6ngYM7AapueqLtvOzjv9+11N2fHDSrkxeMF1YPE20WIfaaawiBg+HZH1E5lHrcJxlKR42t6XPOEmMmqcAsU1g==", + "dev": true, + "requires": { + "bindings": "~1.2.1", + "nan": "^2.0.7" + } + }, "debug": { "version": "3.1.0", "resolved": "https://registry.npmjs.org/debug/-/debug-3.1.0.tgz", diff --git a/package.json b/package.json index a7355d5faadbe..012664ba79945 100644 --- a/package.json +++ b/package.json @@ -78,6 +78,7 @@ "cross-env": "3.2.4", "cssnano": "4.0.3", "enzyme": "3.7.0", + "deasync": "0.1.13", "deep-freeze": "0.0.1", "doctrine": "2.1.0", "eslint-plugin-jest": "21.5.0",