soraka/bin/soraka-serve.js

Soraka is a React packaging tool for dcloud.

module.exports = {
  command: 'serve',
  describe: 'Serve a local development environment.',
  handler: function(argv) {
    // 将当前进程的 NODE_ENV 设置为 development
    process.env.NODE_ENV = 'development'

    const opn = require('opn')
    const path = require('path')
    const express = require('express')
    const webpack = require('webpack')
    const proxyMiddleware = require('http-proxy-middleware')

    const config = require('../config')
    const webpackConfig = require('../build/webpack.dev')

    // 本地调试服务器端口号
    const port = argv.p || config.port

    // 是否自动打开浏览器
    const autoOpenBrowser = argv.opn || config.autoOpenBrowser

    // Define HTTP proxies to your custom API backend
    // https://github.com/chimurai/http-proxy-middleware
    const proxyTable = config.proxy

    const app = express()
    const compiler = webpack(webpackConfig)

    const devMiddleware = require('webpack-dev-middleware')(compiler, {
        publicPath: config.PUBLIC_PATH,
        quiet: false,
        stats: {
            colors: true
        }
    })

    const hotMiddleware = require('webpack-hot-middleware')(compiler, {
        log: () => {}
    })

    // force page reload when html-webpack-plugin template changes
    compiler.plugin('compilation', function (compilation) {
        compilation.plugin('html-webpack-plugin-after-emit', function (data, cb) {
            hotMiddleware.publish({ action: 'reload' })
            cb()
        })
    })

    // proxy api requests
    Object.keys(proxyTable).forEach(function (context) {
        var options = proxyTable[context]
        if (typeof options === 'string') {
            options = { target: options }
        }
        app.use(proxyMiddleware(options.filter || context, options))
    })

    // handle fallback for HTML5 history API
    app.use(require('connect-history-api-fallback')())

    // serve webpack bundle output
    app.use(devMiddleware)

    // enable hot-reload and state-preserving
    // compilation error display
    app.use(hotMiddleware)

    // serve pure static assets
    app.use('/assets', express.static(config.SOURCE_ASSETS_PATH))

    let uri = 'http://localhost:' + port

    console.log('> Starting dev server...')
    devMiddleware.waitUntilValid(() => {
      console.log('> Listening at ' + uri + '\n')
      // when env is testing, don't need open it
      if (autoOpenBrowser && process.env.NODE_ENV !== 'testing') {
        opn(uri)
      }
    })

    app.listen(port)
  }
}