pacpan/bin.js

#!/usr/bin/env node
'use strict';

function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }

var browserify = _interopDefault(require('browserify'));
var chalk = _interopDefault(require('chalk'));
var exorcist = _interopDefault(require('exorcist'));
var fs = _interopDefault(require('fs'));
var mkdirp = _interopDefault(require('mkdirp'));
var rollupify = _interopDefault(require('rollupify'));
var uglifyJs = _interopDefault(require('uglify-js'));
var path = require('path');
var isSudo = _interopDefault(require('is-sudo'));
var tls = require('tls');
var url = require('url');
var send = _interopDefault(require('send'));
var http = _interopDefault(require('http'));
var https = _interopDefault(require('https'));
var watchify = _interopDefault(require('watchify'));

function bundle(opts) {
  const domain = chalk.dim(`[${opts.domain}]`)

  console.log(domain, `PacPan is getting your Panels app "${opts.expose}" ready to go :)`)
  console.time('pacpan-bundle')

  const b = browserify({
    debug: true,
    entries: [opts.entry]
  })

  // entry point of our app, panels needs this to require it
  b.require(opts.entry, {expose: opts.expose})

  // expose the app dependencies
  b.require(opts.requires)

  // rollupify the bundle
  b.transform(rollupify, {config: opts.rollupConfig})

  // declare our build's externals
  opts.externals.forEach(dep => b.external(dep))

  // make sure the bundle directory exists
  mkdirp.sync(opts.bundle)

  // determine the bundle's full path
  const out = `${opts.expose.replace(/[@\/]/g, '')}-${opts.version}`

  const outJs = `${out}.js`
  const outJsMap = `${outJs}.map`

  const outJsMin = `${out}.min.js`
  const outJsMinMap = `${outJsMin}.map`

  function minify() {
    const minified = uglifyJs.minify(`${opts.bundle}/${outJs}`, {
      compress: {
        screw_ie8: true
      },
      inSourceMap: `${opts.bundle}/${outJsMap}`,
      mangle: {
        screw_ie8: true
      },
      outSourceMap: outJsMinMap
    })

    // write the minified code
    const codeStream = fs.createWriteStream(`${opts.bundle}/${outJsMin}`, 'utf8')
    codeStream.write(minified.code, () => codeStream.end())

    // write the minified map code
    const mapStream = fs.createWriteStream(`${opts.bundle}/${outJsMinMap}`, 'utf8')
    mapStream.write(minified.map, () => mapStream.end())
  }

  function buildIndexHtml() {
    const out = fs.createWriteStream(`${opts.bundle}/index.html`, 'utf8')

    const html = fs.readFileSync(`${__dirname}/playground.html`).toString()
      .replace(
        '<script src=/panels.js></script>\n',
        `<script src=/${outJsMin}></script>\n<script src=https://cdn.uxtemple.com/panels.js></script>\n`
      )

    out.write(html, () => out.end())
  }

  function buildPanelsJson() {
    const out = fs.createWriteStream(`${opts.bundle}/panels.json`, 'utf8')

    const json = fs.readFileSync(`${__dirname}/panels.json`).toString().replace('app.js', outJsMin)

    out.write(json)
    out.end()
  }

  b.bundle()
    .pipe(exorcist(`${opts.bundle}/${outJsMap}`, outJsMap))
    .pipe(fs.createWriteStream(`${opts.bundle}/${outJs}`), 'utf8')
    .on('finish', () => {
      // minify()
      // buildIndexHtml()
      // buildPanelsJson()

      console.timeEnd('pacpan-bundle')
      console.log(domain, `PacPan just finished. Your bundle is at ${opts.bundle}:`)
      console.log(fs.readdirSync(opts.bundle).join(', '))
    })
}

function getConfig(raw) {
  const path$$ = path.resolve(raw)

  const configFile = `${path$$}/panels.config.js`
  const pkg = require(`${path$$}/package.json`)
  const rollupConfig = require(`${__dirname}/rollup.config.js`)(path$$)
  const version = pkg.version || 'dev'

  const defaultOpts = {
    // static assets path to put your images, files, etc.
    assets: `${path$$}/public/`,

    // the path to the bundleda pp
    bundle: `${path$$}/bundle/${version}`,

    // the app's entry point
    entry: `${path$$}/${pkg.main}`,

    // dependencies that panels already bundles for us and we can safely declare as externals
    externals: Object.keys(
      require('panels/package.json').dependencies
    ).concat([
      'redux-promise',
      'panels'
    ]),

    // the app's name that panels will call it after, generally its the domain where it runs
    expose: pkg.name,

    // the domain to run on, defaults to the package name
    domain: pkg.name,

    // web handler for specific requests in dev mode
    handler: (req, res, next) => next(),

    // host to run the dev server at
    host: '0.0.0.0',

    // expose your own requires for your own use too
    requires: [], // pkg.dependencies ? Object.keys(pkg.dependencies) : [],

    // path to rollup.config.js used to transform the code
    rollupConfig,

    // the root to run on in that domain
    root: '/',

    secure: false,

    // list of path regexes to serve as regular files and not to try to render them as panels paths
    serveAsIs: [],

    // path to the temporary bundle used when watching
    tmp: `${path$$}/panels.app.tmp.js`,

    // the version we're working on
    version: version
  }


  return fs.existsSync(configFile) ?
    Object.assign(defaultOpts, require(configFile)) :
    defaultOpts
}

var HELP = `
Pacpan helps you package and run panels apps with as little configuration as needed.

Development is the default mode of operation. It is what happens when you run "pacpan".

You can target multiple apps at once, just run: "pacpan . ../path/to/another/app".
Notice the first ".", it means that you want to target this directory as an app too.

"pacpan bundle" bundles the assets for you.`

const panelsVersion = require('panels/package.json').version
const panelsJs = require.resolve(`panels/bundle/panels-${panelsVersion}.js`)
const panelsJsonFile = `${__dirname}/panels.json`
const playgroundFile = `${__dirname}/playground.html`

const FILES = {
  // serve the panels runtime
  'panels.js': panelsJs,
  // serve panels.json if it wasn't served from assets
  'panels.json': panelsJsonFile,
  // serve the panels runtime source map
  [`panels-${panelsVersion}.js.map`]: `${panelsJs}.map`
}

function isFile(file) {
  try {
    const stat = fs.statSync(file)
    return stat.isFile()
  } catch(err) {
    return false
  }
}

var createHandler = app => (req, res) => {
  try {
    const pathname = url.parse(req.url).pathname.replace(app.root, '')
    const assetFile = `${app.assets}${pathname}`
    let file

    if (pathname === 'app.js') {
      // serve panels packaged app.js'
      file = app.tmp
    } else if (isFile(assetFile)) {
      // serve static assets
      file = assetFile
    } else if (FILES[pathname]) {
      file = FILES[pathname]
    } else if (app.serveAsIs.find(regex => regex.test(pathname))) {
      // serve files that the user defined they want them like that
      if (isFile(assetFile)) {
        file = assetFile
      }
    } else {
      // catch all for index
      const customIndexFile = `${app.assets}/index.html`

      file = fs.existsSync(customIndexFile) ? customIndexFile : playgroundFile
    }

    res.setHeader('Access-Control-Allow-Origin', '*')
    res.setHeader('Access-Control-Allow-Headers', 'Origin, X-Requested-With, Content-Type, Accept')
    send(req, file).pipe(res)
  } catch(err) {
    res.writeHead(404)
    res.end()
  }
}

const HOST = '0.0.0.0'

function serve(apps) {
  const appsByRoot = {}
  const roots = apps.map(app => {
    const root = `${app.domain}${app.root}`
    appsByRoot[root] = app
    if (app.secure) {
      app.secureContext = tls.createSecureContext({
        cert: fs.readFileSync(app.secure.cert),
        key: fs.readFileSync(app.secure.key)
      })
    }
    return root
  })

  const findApp = req => {
    const fullUrl = `${req.headers.host}${req.url}`
    const root = roots.filter(r => fullUrl.indexOf(r.replace(/\/$/, '')) === 0).sort()[0]
    return appsByRoot[root] || apps[0]
  }

  let warnedAboutSecure = false

  const SNICallback = (domain, cb) => {
    try {
      // any app on that domain will do as they should all have the same key/cert
      const app = apps.find(a => a.domain === domain)

      if (!app.secure && !warnedAboutSecure) {
        warnedAboutSecure = true
        setTimeout(() => warnedAboutSecure = false, 100)

        console.log(chalk.red(`You tried to access ${domain} through https but we don't have its certificate and key.`),
`Does the app's panels.config.js include a secure key like?:

  secure: {
    cert: '/path/to/file.cert',
    key: '/path/to/file.key'
  }

If you don't care about https, you can always access http://${domain}`)
      }

      cb(null, app.secureContext)
    } catch(err) {
      console.log(chalk.red(domain), err)
    }
  }

  const handler = (req, res) => {
    const app = findApp(req)
    app.handler(req, res, () => createHandler(app)(req, res))
  }

  const s = https.createServer({ SNICallback }, handler)
  s.on('error', console.error.bind(console))
  s.on('listening', () => {
    const list = apps.filter(a => a.secure)
    if (list.length) {
      console.log(chalk.green('secure apps'))
      console.log(list.map(app => `  https://${app.domain}${app.root}`).join('\n'))
    }
  })
  s.listen(443, HOST)

  const s2 = http.createServer((req, res) => {
    const app = findApp(req)

    if (app.secure) {
      res.writeHead(302, { Location: `https://${req.headers.host}${app.root}` })
      res.end()
    } else {
      handler(req, res)
    }
  })
  s2.on('error', console.error.bind(console))
  s2.on('listening', () => {
    const list = apps.filter(a => !a.secure)

    if (list.length) {
      console.log(chalk.yellow('insecure apps'))
      console.log(list.map(app => `  http://${app.domain}${app.root}`).join('\n'))
    }
  })
  s2.listen(80, HOST)
}

let watchError
function watch(opts) {
  const b = browserify({
    cache: {},
    // debug: true,
    entries: [opts.entry],
    packageCache: {},
    plugin: [watchify]
  })

  const domain = chalk.dim(`[${opts.domain}${opts.root}]`)

  // entry point of our app, panels needs this to require it
  b.require(opts.entry, {expose: opts.expose})

  // expose the app dependencies
  b.require(opts.requires)

  // rollupify the bundle
  b.transform(rollupify, {config: opts.rollupConfig, sourceMaps: false})

  // declare our build's externals
  opts.externals.forEach(dep => b.external(dep))

  // run the bundle and output to the console
  function bundle() {
    b.bundle().pipe(fs.createWriteStream(opts.tmp))
  }
  bundle()

  b.on('update', bundle)
  b.on('log', msg => {
    console.log(domain, msg)
  })

  b.on('bundle', theBundle => {
    theBundle.on('error', error => {
      if (watchError !== error.stack) {
        if (error.codeFrame) {
          console.error(domain, chalk.red(`${error.constructor.name} at ${error.id}`))
          console.error(domain, error.codeFrame)
        } else {
          const match = error.stack.match(/Error: Could not resolve (.+?) from (.+?) while/)
          if (match) {
            console.error(domain, chalk.red(`ImportError at ${match[2]}`))
            console.error(domain, 'Does', chalk.blue(match[1]), 'exist? Check that import statement.')
          } else {
            console.error(domain, error.stack)
          }
        }
        watchError = error.stack
      }
      b.removeAllListeners()
      b.close()
      setTimeout(() => watch(opts), 1000)
    })
  })

  return function cleanup() {
    try {
      fs.unlinkSync(opts.tmp)
    } catch(err) {
    }

    try {
      fs.unlinkSync(`${opts.entry}.tmp`)
    } catch(err) {
    }
    process.exit()
  }
}

process.on('uncaughtException', err => {
  console.error('Uncaught exception:', err.stack)
})

const getApps = () => (
  process.argv[3] ? process.argv.slice(3, process.argv.length) : [process.cwd()]
).map(getConfig)

switch(process.argv[2]) {
case 'bundle':
  getApps().forEach(bundle)
  break

case 'start':
  isSudo(is => {
    if (!is) {
      console.error(chalk.red(`Please run "sudo ${process.argv.join(' ')}" instead`))
      return
    }

    console.log(chalk.blue('PacPan is starting'))
    console.log(chalk.gray('To exit it, press ctrl+c'))
    const apps = getApps()
    serve(apps)
    const watchers = apps.map(watch)
    const cleanup = () => watchers.forEach(w => w())

    // clean up the temp file on exit and ctrl+c event
    process.on('exit', cleanup)
    process.on('SIGINT', cleanup)
  })
  break

case 'help':
default:
  console.log(HELP)
  break
}