fix: use custom rollup config to build instead of libundler

Author: pedronauck

core/docz-core/librc.js

@@ -4,17 +4,16 @@
   "description": "All docz core logic of bundle and parsing is included on this package",
   "license": "MIT",
   "main": "dist/index.js",
-  "module": "dist/index.m.js",
+  "module": "dist/index.esm.js",
   "typings": "dist/index.d.ts",
-  "source": "src/index.ts",
   "files": [
     "dist/",
     "package.json",
     "README.md"
   ],
   "scripts": {
-    "dev": "libundler watch --ts -e all",
-    "build": "libundler build --ts -e all --c",
+    "dev": "cross-env NODE_ENV=development yarn build -w",
+    "build": "cross-env NODE_ENV=production rollup -c",
     "fix": "run-s fix:*",
     "fix:prettier": "prettier \"src/**/*.{ts,tsx,md,mdx,js,jsx,json}\" --write",
     "fix:tslint": "tslint --fix --project .",
@@ -54,6 +53,7 @@
     "lodash": "^4.17.11",
     "mini-html-webpack-plugin": "^0.2.3",
     "p-reduce": "^1.0.0",
+    "pretty-error": "^2.1.1",
     "react-dev-utils": "^7.0.0",
     "react-docgen": "^2.21.0",
     "react-docgen-actual-name-handler": "0.13.5",
@@ -73,7 +73,7 @@
     "thread-loader": "^2.1.1",
     "titleize": "^1.0.1",
     "url-loader": "^1.1.2",
-    "webpack": "^4.28.2",
+    "webpack": "^4.28.3",
     "webpack-bundle-analyzer": "^3.0.3",
     "webpack-chain": "^5.0.1",
     "webpack-dev-server": "^3.1.14",

core/docz-core/package.json

@@ -0,0 +1,6 @@
+import { config, copy } from 'docz-rollup'
+
+export default config({
+  input: 'src/index.ts',
+  plugins: [copy('templates', 'dist/templates')],
+})

core/docz-core/rollup.config.js

@@ -1,10 +1,11 @@
 import * as fs from 'fs-extra'
-import chalk from 'chalk'
-import logger, { Signale } from 'signale'
+import * as logger from 'signale'
+import * as envDotProp from 'env-dot-prop'
 import webpack, { Configuration as CFG } from 'webpack'
-import FSR from 'react-dev-utils/FileSizeReporter'
-import formatWebpackMessages from 'react-dev-utils/formatWebpackMessages'
-import envDotProp from 'env-dot-prop'
+import chalk from 'chalk'
+
+const FSR = require('react-dev-utils/FileSizeReporter')
+const formatWebpackMessages = require('react-dev-utils/formatWebpackMessages')
 
 import * as paths from '../config/paths'
 
@@ -109,7 +110,7 @@ const onError = (err: Error) => {
 }
 
 export const build = async (config: CFG, dist: string, publicDir: string) => {
-  const interactive = new Signale({ interactive: true, scope: 'build' })
+  const interactive = new logger.Signale({ interactive: true, scope: 'build' })
 
   try {
     interactive.start('Creating an optimized bundle')

core/docz-core/src/bundler/build.ts

@@ -1,7 +1,7 @@
 import * as path from 'path'
 import { Configuration } from 'webpack'
+import * as envDotProp from 'env-dot-prop'
 import Config from 'webpack-chain'
-import envDotProp from 'env-dot-prop'
 
 import * as loaders from './loaders'
 import * as plugins from './plugins'

core/docz-core/src/bundler/config.ts

@@ -2,20 +2,20 @@ import chalk from 'chalk'
 import logger from 'signale'
 import WebpackDevServer from 'webpack-dev-server'
 import { Configuration as Config } from 'webpack'
+import PrettyError from 'pretty-error'
 
 import { devServerConfig } from './devserver'
 import { Config as Args } from '../config/argv'
 import { ServerHooks as Hooks } from '../lib/Bundler'
 
+const pe = new PrettyError()
 const createCompiler = (config: Config) =>
   new Promise<any>(resolve => {
     try {
       resolve(require('webpack')(config))
     } catch (err) {
       logger.fatal(chalk.red('Failed to compile.'))
-      logger.fatal()
-      logger.fatal(err.message || err)
-      logger.fatal()
+      pe.render(err)
       process.exit(1)
     }
   })

core/docz-core/src/bundler/server.ts

@@ -1,4 +1,4 @@
-import yargs from 'yargs'
+import * as yargs from 'yargs'
 
 import { setArgs } from './config/argv'
 import { setEnv } from './config/env'

core/docz-core/src/cli.ts

@@ -1,6 +1,6 @@
 import { Arguments } from 'yargs'
-import logger from 'signale'
-import envDotProp from 'env-dot-prop'
+import * as envDotProp from 'env-dot-prop'
+import PrettyError from 'pretty-error'
 
 import { Plugin } from '../lib/Plugin'
 import { Entries } from '../lib/Entries'
@@ -9,6 +9,7 @@ import { parseConfig } from '../config/docz'
 import { bundler as webpack } from '../bundler'
 import * as states from '../states'
 
+const pe = new PrettyError()
 export const build = async (args: Arguments<any>) => {
   const env = envDotProp.get('node.env')
   const config = await parseConfig(args)
@@ -32,7 +33,7 @@ export const build = async (args: Arguments<any>) => {
     await run('onPostBuild', config)
     await dataServer.close()
   } catch (err) {
-    logger.fatal(err)
+    pe.render(err)
     process.exit(1)
   }
 }

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

@@ -1,8 +1,9 @@
 process.setMaxListeners(Infinity)
 
 import { Arguments } from 'yargs'
-import logger from 'signale'
-import envDotProp from 'env-dot-prop'
+import * as logger from 'signale'
+import * as envDotProp from 'env-dot-prop'
+import PrettyError from 'pretty-error'
 
 import { Entries } from '../lib/Entries'
 import { DataServer } from '../lib/DataServer'
@@ -11,6 +12,7 @@ import { onSignal } from '../utils/on-signal'
 import { bundler as webpack } from '../bundler'
 import * as states from '../states'
 
+const pe = new PrettyError()
 export const dev = async (args: Arguments<any>) => {
   const env = envDotProp.get('node.env')
   const config = await parseConfig(args)
@@ -23,7 +25,8 @@ export const dev = async (args: Arguments<any>) => {
   try {
     await Entries.writeApp(config, true)
   } catch (err) {
-    logger.fatal('Failed to build your files:', err)
+    logger.fatal('Failed to build your files')
+    pe.render(err)
     process.exit(1)
   }
 
@@ -41,7 +44,8 @@ export const dev = async (args: Arguments<any>) => {
     await dataServer.init()
     await dataServer.listen()
   } catch (err) {
-    logger.fatal('Failed to process data server:', err)
+    logger.fatal('Failed to process data server')
+    pe.render(err)
     await dataServer.close()
     process.exit(1)
   }

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

@@ -1,9 +1,9 @@
 import * as fs from 'fs-extra'
 import { Argv as Yargs } from 'yargs'
-import envDotProp from 'env-dot-prop'
+import * as envDotProp from 'env-dot-prop'
 import humanize from 'humanize-string'
 import titleize from 'titleize'
-import get from 'lodash/get'
+import { get } from 'lodash/fp'
 
 import { Plugin } from '../lib/Plugin'
 import { BabelRC } from '../config/babel'
@@ -12,14 +12,13 @@ import * as paths from '../config/paths'
 const getEnv = (val: string | string[], defaultValue: any = null): any =>
   envDotProp.get(val, defaultValue, { parse: true })
 
-const removeScope = (name: string) => name.replace(/^@.*\//, '')
 const getInitialTitle = (pkg: any): string => {
-  const name = get(pkg, 'name') || 'MyDoc'
-  return titleize(humanize(removeScope(name)))
+  const name = get('name', pkg) || 'MyDoc'
+  return titleize(humanize(name.replace(/^@.*\//, '')))
 }
 
 const getInitialDescription = (pkg: any): string =>
-  get(pkg, 'description') || 'My awesome app using docz'
+  get('description', pkg) || 'My awesome app using docz'
 
 export type Env = 'production' | 'development'
 export type ThemeConfig = Record<string, any>

core/docz-core/src/config/argv.ts

@@ -1,5 +1,5 @@
 import * as path from 'path'
-import envDotProp from 'env-dot-prop'
+import * as envDotProp from 'env-dot-prop'
 
 import { root, resolveApp } from './paths'
 

core/docz-core/src/config/env.ts

@@ -1,6 +1,6 @@
 import * as fs from 'fs'
 import * as path from 'path'
-import resolve from 'resolve'
+import * as resolve from 'resolve'
 
 const ensureSlash = (filepath: any, needsSlash: boolean) => {
   const hasSlash = filepath.endsWith('/')

core/docz-core/src/config/paths.ts

@@ -1,8 +1,9 @@
 import * as path from 'path'
 import * as fs from 'fs-extra'
-import { mdast } from 'docz-utils'
+import { parseMdx } from 'docz-utils/lib/mdast'
 import { touch, compiled } from 'docz-utils/lib/fs'
 import glob from 'fast-glob'
+import PrettyError from 'pretty-error'
 
 import * as paths from '../config/paths'
 
@@ -13,6 +14,7 @@ import { getRepoEditUrl } from '../utils/repo-info'
 
 export const fromTemplates = (file: string) => path.join(paths.templates, file)
 
+const pe = new PrettyError()
 const mapToObj = (map: Map<any, any>) =>
   Array.from(map.entries()).reduce(
     (obj, [key, value]) => ({ ...obj, [`${key}`]: value }),
@@ -88,7 +90,7 @@ export class Entries {
 
     const createEntry = async (file: string) => {
       try {
-        const ast = await mdast.parseMdx(file)
+        const ast = await parseMdx(file)
         const entry = new Entry(ast, file, src)
 
         if (this.repoEditUrl) entry.setLink(this.repoEditUrl)
@@ -99,6 +101,8 @@ export class Entries {
           ...rest,
         }
       } catch (err) {
+        console.log(err)
+        config.debug && pe.render(err)
         return null
       }
     }

core/docz-core/src/lib/Entries.ts

@@ -2,7 +2,12 @@ import * as path from 'path'
 import * as crypto from 'crypto'
 import slugify from '@sindresorhus/slugify'
 import humanize from 'humanize-string'
-import { mdast } from 'docz-utils'
+import {
+  getParsedData,
+  headingsFromAst,
+  Heading,
+  ParsedData,
+} from 'docz-utils/lib/mdast'
 
 import * as paths from '../config/paths'
 
@@ -21,7 +26,7 @@ export interface EntryObj {
   route: string
   order: number
   menu: string | null
-  headings: mdast.Heading[]
+  headings: Heading[]
   [key: string]: any
 }
 
@@ -36,14 +41,14 @@ export class Entry {
   public name: string
   public order: number
   public menu: string | null
-  public headings: mdast.Heading[]
+  public headings: Heading[]
   public settings: {
     [key: string]: any
   }
 
   constructor(ast: any, file: string, src: string) {
     const filepath = this.getFilepath(file, src)
-    const parsed = mdast.getParsedData(ast)
+    const parsed = getParsedData(ast)
     const name = this.getName(filepath, parsed)
 
     this.id = createId(file)
@@ -54,7 +59,7 @@ export class Entry {
     this.name = name
     this.order = parsed.order || 0
     this.menu = parsed.menu || null
-    this.headings = mdast.headingsFromAst(ast)
+    this.headings = headingsFromAst(ast)
     this.settings = parsed
   }
 
@@ -75,7 +80,7 @@ export class Entry {
     return filepath
   }
 
-  private getName(filepath: string, parsed: mdast.ParsedData): string {
+  private getName(filepath: string, parsed: ParsedData): string {
     const filename = humanize(path.parse(filepath).name)
     return parsed && parsed.name ? parsed.name : filename
   }

core/docz-core/src/lib/Entry.ts

@@ -8,10 +8,12 @@ import importedProptypesHandler from 'react-docgen-imported-proptype-handler'
 import actualNameHandler from 'react-docgen-actual-name-handler'
 import reactDocgenTs from 'react-docgen-typescript'
 import reactDocgen from 'react-docgen'
+import PrettyError from 'pretty-error'
 
 import * as paths from '../config/paths'
 import { Config } from '../config/argv'
 
+const pe = new PrettyError()
 const fileFullPath = (filepath: string) => path.join(paths.root, filepath)
 
 const tsParser = async (files: string[], config: Config) => {
@@ -32,7 +34,8 @@ const tsParser = async (files: string[], config: Config) => {
       .map(filepath => ({ [fileFullPath(filepath)]: parse(filepath) }))
       .reduce((obj, val) => ({ ...obj, ...val }), {})
   } catch (err) {
-    logger.fatal('Error parsing static types.', err)
+    logger.fatal('Error parsing static types.')
+    pe.render(err)
     return {}
   }
 }
@@ -55,9 +58,7 @@ const jsParser = (files: string[], config: Config) => {
       const data = reactDocgen.parse(code, resolver, handlers)
       memo[fileFullPath(filepath)] = data
     } catch (err) {
-      if (err.message !== 'No suitable component definition found.') {
-        logger.fatal('Error:', filepath, err)
-      }
+      pe.render(err)
     }
 
     return memo

core/docz-core/src/utils/docgen.ts

@@ -1,11 +1,13 @@
 {
   "extends": "../../tsconfig.json",
   "compilerOptions": {
-    "declaration": true,
+    "module": "esnext",
     "outDir": "dist",
     "rootDir": "src",
-    "typeRoots": ["../../node_modules/@types", "node_modules/@types", "src/types"]
+    "declaration": true,
+    "types": ["node"],
+    "typeRoots": ["../../node_modules/@types", "node_modules/@types"]
   },
-  "include": ["src/**/*"],
+  "include": ["src/**/*", "src/types.d.ts"],
   "exclude": ["node_modules/**"]
 }