build/dev-server.js

   1 require('./check-versions')()
   2
   3 var config = require('../config')
   4 if (!process.env.NODE_ENV) {
   5   process.env.NODE_ENV = JSON.parse(config.dev.env.NODE_ENV)
   6 }
   7
   8 var opn = require('opn')
   9 var path = require('path')
  10 var express = require('express')
  11 var webpack = require('webpack')
  12 var proxyMiddleware = require('http-proxy-middleware')
  13 var webpackConfig = require('./webpack.dev.conf')
  14
  15 // default port where dev server listens for incoming traffic
  16 var port = process.env.PORT || config.dev.port
  17 // automatically open browser, if not set will be false
  18 var autoOpenBrowser = !!config.dev.autoOpenBrowser
  19 // Define HTTP proxies to your custom API backend
  20 // https://github.com/chimurai/http-proxy-middleware
  21 var proxyTable = config.dev.proxyTable
  22
  23 var app = express()
  24 var compiler = webpack(webpackConfig)
  25
  26 var devMiddleware = require('webpack-dev-middleware')(compiler, {
  27   publicPath: webpackConfig.output.publicPath,
  28   quiet: true
  29 })
  30
  31 var hotMiddleware = require('webpack-hot-middleware')(compiler, {
  32   log: () => {}
  33 })
  34 // force page reload when html-webpack-plugin template changes
  35 compiler.plugin('compilation', function (compilation) {
  36   compilation.plugin('html-webpack-plugin-after-emit', function (data, cb) {
  37     hotMiddleware.publish({ action: 'reload' })
  38     cb()
  39   })
  40 })
  41
  42 // proxy api requests
  43 Object.keys(proxyTable).forEach(function (context) {
  44   var options = proxyTable[context]
  45   if (typeof options === 'string') {
  46     options = { target: options }
  47   }
  48   app.use(proxyMiddleware(options.filter || context, options))
  49 })
  50
  51 // handle fallback for HTML5 history API
  52 app.use(require('connect-history-api-fallback')())
  53
  54 // serve webpack bundle output
  55 app.use(devMiddleware)
  56
  57 // enable hot-reload and state-preserving
  58 // compilation error display
  59 app.use(hotMiddleware)
  60
  61 // serve pure static assets
  62 var staticPath = path.posix.join(config.dev.assetsPublicPath, config.dev.assetsSubDirectory)
  63 app.use(staticPath, express.static('./static'))
  64
  65 var uri = 'http://localhost:' + port
  66
  67 var _resolve
  68 var readyPromise = new Promise(resolve => {
  69   _resolve = resolve
  70 })
  71
  72 console.log('> Starting dev server...')
  73 devMiddleware.waitUntilValid(() => {
  74   console.log('> Listening at ' + uri + '\n')
  75   // when env is testing, don't need open it
  76   if (autoOpenBrowser && process.env.NODE_ENV !== 'testing') {
  77     opn(uri)
  78   }
  79   _resolve()
  80 })
  81
  82 var server = app.listen(port)
  83
  84 module.exports = {
  85   ready: readyPromise,
  86   close: () => {
  87     server.close()
  88   }
  89 }