Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Revert "Build: Change package build step to async flow" #13195

Merged
merged 1 commit into from
Jan 7, 2019
Merged

Revert "Build: Change package build step to async flow" #13195

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
107 changes: 45 additions & 62 deletions bin/packages/build.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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
Expand All @@ -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
*
Expand Down Expand Up @@ -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.
Expand All @@ -97,50 +87,39 @@ 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 );
}

/**
* Build a javaScript file for the required environments (node and ES5)
*
* @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: (
Expand All @@ -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 );
}

/**
Expand All @@ -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(
Expand All @@ -205,25 +189,24 @@ 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`,
],
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` );
}

Expand All @@ -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' );
}
16 changes: 16 additions & 0 deletions package-lock.json
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -77,6 +77,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",
Expand Down