feat(config): allow to specify port and basePath options under `d…

…ev` (#60)

* chore(config): allow to specify port and basePath in config model

* feat(config): allow to specify `port` and `basePath` options under `dev`

lib/cli/dev.js

@@ -18,12 +18,10 @@ exports.builder = {
   port: {
     alias: 'p',
     describe: 'Port number of dev server',
-    default: 3000,
     number: true
   },
   'base-path': {
-    describe: 'Base path of dev server',
-    default: '/'
+    describe: 'Base path of dev server'
   }
 }
 
@@ -32,26 +30,25 @@ exports.handler = (argv, debug) => {
 
   const configPath = argv.config || findConfig(process.cwd())
   assert(configPath, 'Config file is not found')
-  const config = loadConfig(configPath)
-
   assert(!Number.isNaN(argv.port), '--port should be a number')
 
+  const config = loadConfig(configPath).extend({
+    port: argv.port,
+    basePath: argv['base-path']
+  })
+
   // Logger
   const logger = new DevLogger(config, {
     console: debug.console
   })
 
   const resolver = DepResolver.create(config)
 
-  const basePath = argv['base-path']
-
   const bs = create(config, {
-    port: argv.port,
-    startPath: basePath,
     logLevel: 'silent',
     middleware: logMiddleware,
     open: !argv._debug // Internal
-  }, resolver, basePath)
+  }, resolver)
 
   bs.emitter.on('init', () => {
     logger.startDevServer(argv.port, externalIp)

lib/externals/browser-sync.js

@@ -15,13 +15,17 @@ const defaultBsOptions = {
   notify: false
 }
 
-module.exports = (config, bsOptions, depResolver, basePath) => {
+module.exports = (config, bsOptions, depResolver) => {
   const bs = browserSync.create()
 
   bsOptions = util.merge(defaultBsOptions, bsOptions)
+  bsOptions = util.merge(bsOptions, {
+    port: config.port,
+    startPath: config.basePath
+  })
 
   bsOptions.server = config.output
-  injectMiddleware(bsOptions, transformer(config, depResolver, basePath))
+  injectMiddleware(bsOptions, transformer(config, depResolver))
   config.proxy.forEach(p => {
     injectMiddleware(bsOptions, proxy(p.context, p.config))
   })
@@ -45,7 +49,8 @@ function injectMiddleware (options, middleware) {
   options.middleware = [middleware]
 }
 
-function transformer (config, depResolver, basePath) {
+function transformer (config, depResolver) {
+  const basePath = config.basePath
   return (req, res, next) => {
     const parsedPath = url.parse(req.url).pathname
     const reqPath = normalizePath(parsedPath)

lib/models/config.js

@@ -13,6 +13,8 @@ module.exports = class Config {
     this.exclude = config.exclude || []
     this.rules = config.rules || {}
     this.proxy = config.proxy || []
+    this.port = config.port || 3000
+    this.basePath = config.basePath || '/'
     this.filter = config.filter || '**/*'
   }
 
@@ -99,6 +101,7 @@ module.exports = class Config {
 
     const preset = options.preset
     const resolve = makeResolve(options.base || '')
+    const dev = config.dev || {}
 
     return new Config({
       base: options.base,
@@ -114,7 +117,9 @@ module.exports = class Config {
       rules: resolveRules(config.rules || {}, tasks, preset),
 
       // Resolve dev server configs
-      proxy: resolveProxy(config.dev && config.dev.proxy)
+      proxy: resolveProxy(dev.proxy),
+      port: dev.port,
+      basePath: dev.basePath
     })
   }
 }

test/specs/externals/browser-sync.spec.js

@@ -37,6 +37,9 @@ describe('Using browsersync', () => {
     output: 'dist',
     rules: {
       js: 'js'
+    },
+    dev: {
+      port: 51234
     }
   }, {
     js: stream => {
@@ -56,10 +59,9 @@ describe('Using browsersync', () => {
   describe('without base path', () => {
     beforeAll(done => {
       bs = create(config, {
-        port: 51234,
         open: false,
         logLevel: 'silent'
-      }, mockResolver, '/')
+      }, mockResolver)
 
       bs.emitter.on('init', done)
     })
@@ -103,11 +105,12 @@ describe('Using browsersync', () => {
 
   describe('with base path', () => {
     beforeAll(done => {
-      bs = create(config, {
-        port: 51234,
+      bs = create(config.extend({
+        basePath: '/path/to/base/'
+      }), {
         open: false,
         logLevel: 'silent'
-      }, mockResolver, '/path/to/base/')
+      }, mockResolver)
 
       bs.emitter.on('init', done)
     })
@@ -152,21 +155,22 @@ describe('Using browsersync', () => {
               target: 'http://localhost:61234/',
               logLevel: 'silent'
             }
-          }
+          },
+          port: 51234
         }
       }, {}, { base })
 
       proxy = create(proxyConfig, {
-        port: 51234,
         open: false,
         logLevel: 'silent'
-      }, mockResolver, '/')
+      }, mockResolver)
 
-      bs = create(config, {
-        port: 61234,
+      bs = create(config.extend({
+        port: 61234
+      }), {
         open: false,
         logLevel: 'silent'
-      }, mockResolver, '/')
+      }, mockResolver)
 
       const cb = createWaitCallback(2, done)
       proxy.emitter.on('init', cb)
@@ -207,21 +211,23 @@ describe('Using browsersync', () => {
               target: 'http://localhost:61234/',
               logLevel: 'silent'
             }
-          }
+          },
+          port: 51234,
+          basePath: '/assets'
         }
       }, {}, { base })
 
       proxy = create(proxyConfig, {
-        port: 51234,
         open: false,
         logLevel: 'silent'
-      }, mockResolver, '/assets')
+      }, mockResolver)
 
-      bs = create(config, {
-        port: 61234,
+      bs = create(config.extend({
+        port: 61234
+      }), {
         open: false,
         logLevel: 'silent'
-      }, mockResolver, '/')
+      }, mockResolver)
 
       const cb = createWaitCallback(2, done)
       proxy.emitter.on('init', cb)

test/specs/models/config.spec.js

@@ -320,4 +320,30 @@ describe('Config model', () => {
 
     expect(c.proxy).toEqual([])
   })
+
+  it('resolves port config', () => {
+    const c = Config.create({
+      dev: { port: 51234 }
+    }, {})
+
+    expect(c.port).toBe(51234)
+  })
+
+  it('provides 3000 as a default port number', () => {
+    const c = Config.create({}, {})
+    expect(c.port).toBe(3000)
+  })
+
+  it('resolves basePath config', () => {
+    const c = Config.create({
+      dev: { basePath: '/path/to/base' }
+    }, {})
+
+    expect(c.basePath).toBe('/path/to/base')
+  })
+
+  it('provides \'/\' as a default base path', () => {
+    const c = Config.create({}, {})
+    expect(c.basePath).toBe('/')
+  })
 })