feat(docz-core): add promise logger using progress-estimator

packages/docz-core/package.json

@@ -59,6 +59,7 @@
     "lodash.get": "^4.4.2",
     "mini-html-webpack-plugin": "^0.2.3",
     "p-reduce": "^1.0.0",
+    "progress-estimator": "^0.2.2",
     "react-dev-utils": "^6.1.1",
     "react-docgen-typescript-loader": "^3.0.0-rc.0",
     "react-hot-loader": "^4.6.0",

packages/docz-core/src/commands/build.ts

@@ -2,12 +2,13 @@ import logger from 'signale'
 import envDotProp from 'env-dot-prop'
 
 import * as states from '../states'
-import { loadConfig } from '../utils/load-config'
 import { bundler as webpack } from '../webpack'
 import { Entries } from '../Entries'
 import { DataServer } from '../DataServer'
 import { Plugin } from '../Plugin'
 import { Config } from './args'
+import { loadConfig } from '../utils/load-config'
+import { promiseLogger } from '../utils/promise-logger'
 
 export const build = async (args: Config) => {
   const env = envDotProp.get('node.env')
@@ -22,12 +23,13 @@ export const build = async (args: Config) => {
   dataServer.register([states.config(config), states.entries(entries, config)])
 
   try {
-    await Entries.writeApp(config)
-    await dataServer.init()
+    await promiseLogger(Entries.writeApp(config, true), 'Parsing mdx files')
+    await promiseLogger(dataServer.init(), 'Initializing data server')
 
-    await run('onPreBuild', config)
+    await promiseLogger(run('onPreBuild', config), 'Running onPreBuild()')
     await bundler.build(bundlerConfig)
-    await run('onPostBuild', config)
+
+    await promiseLogger(run('onPostBuild', config), 'Running onPostBuild()')
     await dataServer.close()
   } catch (err) {
     logger.fatal(err)

packages/docz-core/src/commands/dev.ts

@@ -10,6 +10,7 @@ import { DataServer } from '../DataServer'
 import { bundler as webpack } from '../webpack'
 import { Entries } from '../Entries'
 import { loadConfig } from '../utils/load-config'
+import { promiseLogger } from '../utils/promise-logger'
 
 export const dev = async (args: Config) => {
   const env = envDotProp.get('node.env')
@@ -21,16 +22,19 @@ export const dev = async (args: Config) => {
   const entries = new Entries(config)
 
   const bundlerConfig = await bundler.mountConfig(env)
-  const app = await bundler.createApp(bundlerConfig)
+  const app = await promiseLogger(
+    bundler.createApp(bundlerConfig),
+    'Creating app...'
+  )
 
   try {
-    await Entries.writeApp(newConfig, true)
+    await promiseLogger(Entries.writeApp(newConfig, true), 'Parsing mdx files')
   } catch (err) {
     logger.fatal('Failed to build your files:', err)
     process.exit(1)
   }
 
-  const server = await app.start()
+  const server = await promiseLogger(app.start(), 'Starting your server')
   const dataServer = new DataServer(server, websocketPort, config.websocketHost)
 
   dataServer.register([
@@ -39,7 +43,7 @@ export const dev = async (args: Config) => {
   ])
 
   try {
-    await dataServer.init()
+    await promiseLogger(dataServer.init(), 'Initializing data server')
     await dataServer.listen()
   } catch (err) {
     logger.fatal('Failed to process your server:', err)

packages/docz-core/src/types.d.ts

@@ -18,6 +18,7 @@ declare module 'humanize-string'
 declare module 'lodash.get'
 declare module 'mini-html-webpack-plugin'
 declare module 'p-reduce'
+declare module 'progress-estimator'
 declare module 'react-dev-utils/errorOverlayMiddleware'
 declare module 'react-dev-utils/evalSourceMapMiddleware'
 declare module 'react-dev-utils/FileSizeReporter'

packages/docz-core/src/utils/promise-logger.ts

@@ -0,0 +1,7 @@
+import * as path from 'path'
+import createLogger from 'progress-estimator'
+import * as paths from '../config/paths'
+
+export const promiseLogger = createLogger({
+  storagePath: path.join(paths.cache, '.progress-estimator'),
+})

packages/docz-core/src/webpack/build.ts

@@ -8,6 +8,7 @@ import printBuildError from 'react-dev-utils/printBuildError'
 import envDotProp from 'env-dot-prop'
 
 import * as paths from '../config/paths'
+import { promiseLogger } from '../utils/promise-logger'
 
 const { measureFileSizesBeforeBuild, printFileSizesAfterBuild } = FSR
 const WARN_AFTER_BUNDLE_GZIP_SIZE = 512 * 1024
@@ -42,10 +43,8 @@ const compile = (config: CFG) =>
       })
   })
 
-const builder = async (config: CFG, previousFileSizes: any) => {
-  logger.start('Creating an optimized production build...')
-
-  return new Promise(async (resolve, reject) => {
+const builder = async (config: CFG, previousFileSizes: any) =>
+  new Promise(async (resolve, reject) => {
     try {
       const stats: any = await compile(config)
       const messages = formatWebpackMessages(stats.toJson({}, true))
@@ -71,13 +70,13 @@ const builder = async (config: CFG, previousFileSizes: any) => {
       reject(err)
     }
   })
-}
 
 const onSuccess = (
   dist: string,
   { stats, previousFileSizes, warnings }: any
 ) => {
   if (warnings.length) {
+    logger.log()
     logger.warn('Compiled with warnings.\n')
     logger.warn(warnings.join('\n\n'))
     logger.warn(
@@ -90,11 +89,10 @@ const onSuccess = (
         chalk.cyan('// eslint-disable-next-line') +
         ' to the line before.\n'
     )
-  } else {
-    logger.success(chalk.green('Compiled successfully.\n'))
   }
 
-  logger.log('File sizes after gzip:\n')
+  logger.log()
+  logger.log(`File sizes after gzip:\n`)
   printFileSizesAfterBuild(
     stats,
     previousFileSizes,
@@ -106,9 +104,11 @@ const onSuccess = (
 }
 
 const onError = (err: Error) => {
+  logger.log()
   logger.fatal(chalk.red('Failed to compile.\n'))
   printBuildError(err)
   process.exit(1)
+  logger.log()
 }
 
 export const build = async (config: CFG, dist: string, publicDir: string) => {
@@ -119,7 +119,11 @@ export const build = async (config: CFG, dist: string, publicDir: string) => {
     await fs.emptyDir(dist)
     await copyPublicFolder(dist, publicDir)
 
-    const result = await builder(config, previousFileSizes)
+    const result = await promiseLogger(
+      builder(config, previousFileSizes),
+      'Creating production build'
+    )
+
     onSuccess(dist, result)
   } catch (err) {
     onError(err)

yarn.lock

@@ -3721,6 +3721,11 @@ cli-cursor@^2.0.0, cli-cursor@^2.1.0:
   dependencies:
     restore-cursor "^2.0.0"
 
+cli-spinners@^1.3.1:
+  version "1.3.1"
+  resolved "https://registry.npmjs.org/cli-spinners/-/cli-spinners-1.3.1.tgz#002c1990912d0d59580c93bd36c056de99e4259a"
+  integrity sha512-1QL4544moEsDVH9T/l6Cemov/37iv1RtoKf7NJ04A60+4MREXNfx/QvavbH6QoGdsD4N4Mwy49cmaINR/o2mdg==
+
 cli-truncate@^0.2.1:
   version "0.2.1"
   resolved "https://registry.npmjs.org/cli-truncate/-/cli-truncate-0.2.1.tgz#9f15cfbb0705005369216c626ac7d05ab90dd574"
@@ -6742,6 +6747,11 @@ https-proxy-agent@^2.2.0, https-proxy-agent@^2.2.1:
     agent-base "^4.1.0"
     debug "^3.1.0"
 
+humanize-duration@^3.15.3:
+  version "3.16.0"
+  resolved "https://registry.npmjs.org/humanize-duration/-/humanize-duration-3.16.0.tgz#c7ec3b898305f007c63893f891870b2b5a2e0a7d"
+  integrity sha512-LDnNSe8EkJjhRsijWgUK12UK7ivbCww2R3LW9quKdBDoQjeAewqnGHch5AJTCOny1cPLhnXTzvniXVP3B9O6Ew==
+
 humanize-ms@^1.2.1:
   version "1.2.1"
   resolved "https://registry.npmjs.org/humanize-ms/-/humanize-ms-1.2.1.tgz#c46e3159a293f6b896da29316d8b6fe8bb79bbed"
@@ -9920,6 +9930,16 @@ process@~0.5.1:
   resolved "https://registry.npmjs.org/process/-/process-0.5.2.tgz#1638d8a8e34c2f440a91db95ab9aeb677fc185cf"
   integrity sha1-FjjYqONML0QKkduVq5rrZ3/Bhc8=
 
+progress-estimator@^0.2.2:
+  version "0.2.2"
+  resolved "https://registry.npmjs.org/progress-estimator/-/progress-estimator-0.2.2.tgz#1c3947a5782ea56e40c8fccc290ac7ceeb1b91cb"
+  integrity sha512-GF76Ac02MTJD6o2nMNtmtOFjwWCnHcvXyn5HOWPQnEMO8OTLw7LAvNmrwe8LmdsB+eZhwUu9fX/c9iQnBxWaFA==
+  dependencies:
+    chalk "^2.4.1"
+    cli-spinners "^1.3.1"
+    humanize-duration "^3.15.3"
+    log-update "^2.3.0"
+
 progress@^2.0.0:
   version "2.0.2"
   resolved "https://registry.npmjs.org/progress/-/progress-2.0.2.tgz#db9476f916bcc9ebe8a04efb22b18b0740376c61"