router.base is now working as expected

bin/nuxt-generate

@@ -17,7 +17,8 @@ if (typeof options.rootDir !== 'string') {
   options.rootDir = rootDir
 }
 
-options.build = true // Enable building
+options._build = false // nuxt.generate() will call nuxt.build() itself
+options._renderer = false // let nuxt.generate() create the vue renderer
 options.dev = false // Force production mode (no webpack middlewares called)
 
 console.log('[nuxt] Generating...')

bin/nuxt-start

@@ -15,7 +15,7 @@ if (typeof options.rootDir !== 'string') {
   options.rootDir = rootDir
 }
 
-options.build = false // Disable building
+options._build = false // Disable building
 options.dev = false // Force production mode (no webpack middlewares called)
 
 new Nuxt(options)

examples/hello-world/pages/about.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="container">
-    <img src="/nuxt-square.png" />
+    <img src="../static/nuxt-square.png" />
     <h2>Thank you for testing nuxt.js</h2>
     <p><router-link to="/">Back home</router-link></p>
   </div>

examples/hello-world/pages/index.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="container">
-    <img src="/nuxt.png" />
+    <img src="nuxt.png" />
     <h2>Hello World.</h2>
     <p><router-link to="/about">About</router-link></p>
   </div>

lib/build/index.js

@@ -28,7 +28,7 @@ const defaultsLoaders = [
   {
     test: /\.(png|jpg|gif|svg)$/,
     loader: 'url',
-    options: {
+    query: {
       limit: 1000, // 1KO
       name: 'img/[name].[ext]?[hash]'
     }
@@ -44,14 +44,16 @@ const defaultsLoaders = [
 ]
 
 module.exports = function * () {
-  const noBuild = this.options.build === false
   // Defaults build options
   if (this.options.build && Array.isArray(this.options.build.loaders)) {
     this.options.build = _.defaultsDeep(this.options.build, defaults)
   } else {
     this.options.build = _.defaultsDeep(this.options.build, defaults, { loaders: defaultsLoaders })
   }
-  if (noBuild) {
+  if (!this.options._build && !this.options._renderer) {
+    return Promise.resolve()
+  }
+  if (!this.options._build) {
     const serverConfig = getWebpackServerConfig.call(this)
     const bundlePath = join(serverConfig.output.path, serverConfig.output.filename)
     if (!fs.existsSync(bundlePath)) {

lib/build/webpack/base.config.js

@@ -2,6 +2,7 @@
 
 const vueLoaderConfig = require('./vue-loader.config')
 const { join } = require('path')
+const { urlJoin } = require('../../utils')
 
 /*
 |--------------------------------------------------------------------------
@@ -19,7 +20,7 @@ module.exports = function () {
       vendor: ['vue', 'vue-router', 'vue-meta', 'es6-promise', 'es6-object-assign']
     },
     output: {
-      publicPath: join(this.options.router.base, '/_nuxt/')
+      publicPath: urlJoin(this.options.router.base, '/_nuxt/')
     },
     resolve: {
       modules: [
@@ -53,7 +54,6 @@ module.exports = function () {
   }
   // Add nuxt build loaders (can be configured in nuxt.config.js)
   config.module.rules = config.module.rules.concat(this.options.build.loaders)
-
   // Return config
   return config
 }

lib/build/webpack/server.config.js

@@ -18,7 +18,7 @@ module.exports = function () {
     target: 'node',
     devtool: false,
     entry: resolve(this.dir, '.nuxt', 'server.js'),
-    output: Object.assign({}, base.output, {
+    output: Object.assign({}, config.output, {
       path: resolve(this.dir, '.nuxt', 'dist'),
       filename: 'server-bundle.js',
       libraryTarget: 'commonjs2'

lib/generate.js

@@ -5,7 +5,8 @@ const co = require('co')
 const pify = require('pify')
 const debug = require('debug')('nuxt:generate')
 const _ = require('lodash')
-const { resolve, join, dirname } = require('path')
+const { resolve, join, dirname, sep } = require('path')
+const { urlJoin } = require('./utils')
 const copy = pify(fs.copy)
 const remove = pify(fs.remove)
 const writeFile = pify(fs.writeFile)
@@ -17,15 +18,31 @@ const defaults = {
 }
 
 module.exports = function () {
+  /*
+  ** Update loaders config to add router.base path
+  */
+  this.options.build.loaders.forEach((config) => {
+    if (['file', 'url', 'file-loader', 'url-loader'].includes(config.loader)) {
+      config.query = config.query || {}
+      config.query.publicPath = urlJoin(this.options.router.base, '/_nuxt/')
+    }
+  })
   /*
   ** Set variables
   */
   this.options.generate = _.defaultsDeep(this.options.generate, defaults)
+  var self = this
   var srcStaticPath = resolve(this.dir, 'static')
   var srcBuiltPath = resolve(this.dir, '.nuxt', 'dist')
   var distPath = resolve(this.dir, this.options.generate.dir)
   var distNuxtPath = resolve(distPath, '_nuxt')
   return co(function * () {
+    /*
+    ** Launch build process
+    */
+    self.options._build = true
+    self.options._renderer = true
+    yield self.build()
     /*
     ** Clean destination folder
     */
@@ -50,7 +67,7 @@ module.exports = function () {
     this.routes.forEach((route) => {
       var promise = this.renderRoute(route.path)
       .then(({ html }) => {
-        var path = join(route.path, '/', 'index.html') // /about -> /about/index.html
+        var path = join(route.path, sep, 'index.html') // /about -> /about/index.html
         debug('Generate file: ' + path)
         path = join(distPath, path)
         // Make sure the sub folders are created

lib/nuxt.js

@@ -10,7 +10,8 @@ const serialize = require('serialize-javascript')
 const build = require('./build')
 const generate = require('./generate')
 const serveStatic = require('serve-static')
-const { resolve, join } = require('path')
+const { resolve } = require('path')
+const { urlJoin } = require('./utils')
 const { encodeHtml, getContext, setAnsiColors } = require('./utils')
 setAnsiColors(ansiHTML)
 
@@ -18,6 +19,10 @@ class Nuxt {
 
   constructor (options = {}, cb) {
     var defaults = {
+      // special options
+      _renderer: true,
+      _build: true,
+      // general options
       dev: true,
       plugins: [],
       css: [],
@@ -90,6 +95,11 @@ class Nuxt {
         yield self.webpackDevMiddleware(req, res)
         yield self.webpackHotMiddleware(req, res)
       }
+      // If base in req.url, remove it for the middlewares and vue-router
+      if (self.options.router.base !== '/' && req.url.indexOf(self.options.router.base) === 0) {
+        // Compatibility with base url for dev server
+        req.url = req.url.replace(self.options.router.base, '/')
+      }
       // Serve static/ files
       yield self.serveStatic(req, res)
       // Serve .nuxt/dist/ files (only for production)
@@ -136,9 +146,9 @@ class Nuxt {
         APP: app,
         context: context,
         files: {
-          css: join(self.options.router.base, '/_nuxt/', self.options.build.filenames.css),
+          css: urlJoin(self.options.router.base, '/_nuxt/', self.options.build.filenames.css),
-          vendor: join(self.options.router.base, '/_nuxt/', self.options.build.filenames.vendor),
+          vendor: urlJoin(self.options.router.base, '/_nuxt/', self.options.build.filenames.vendor),
-          app: join(self.options.router.base, '/_nuxt/', self.options.build.filenames.app)
+          app: urlJoin(self.options.router.base, '/_nuxt/', self.options.build.filenames.app)
         }
       })
       return { html, error: context.nuxt.error }

lib/utils.js

@@ -27,3 +27,7 @@ exports.waitFor = function * (ms) {
     setTimeout(resolve, (ms || 0))
   })
 }
+
+exports.urlJoin = function () {
+  return [].slice.call(arguments).join('/').replace(/\/+/g, '/')
+}