diff --git a/lib/build.js b/lib/build.js index 80da01b947..6cb958d44c 100644 --- a/lib/build.js +++ b/lib/build.js @@ -13,6 +13,8 @@ import { createBundleRenderer } from 'vue-server-renderer' import { join, resolve, sep } from 'path' import clientWebpackConfig from './webpack/client.config.js' import serverWebpackConfig from './webpack/server.config.js' +import chalk from 'chalk' +import PostCompilePlugin from 'post-compile-webpack-plugin' const remove = pify(fs.remove) const readFile = pify(fs.readFile) const writeFile = pify(fs.writeFile) @@ -36,6 +38,12 @@ const r = function () { args = args.map(normalize) return wp(resolve.apply(null, args)) } +const webpackStats = { + chunks: false, + children: false, + modules: false, + colors: true +} // force green color debug.color = 2 @@ -336,24 +344,39 @@ function getWebpackServerConfig () { function createWebpackMiddleware () { const clientConfig = getWebpackClientConfig.call(this) + const host = process.env.HOST || '127.0.0.1' + const port = process.env.PORT || '3000' // setup on the fly compilation + hot-reload clientConfig.entry.app = _.flatten(['webpack-hot-middleware/client?reload=true', clientConfig.entry.app]) clientConfig.plugins.push( new webpack.HotModuleReplacementPlugin(), - new webpack.NoEmitOnErrorsPlugin() + new webpack.NoEmitOnErrorsPlugin(), + new PostCompilePlugin(stats => { + process.stdout.write('\x1Bc') + + if (stats.hasErrors() || stats.hasWarnings()) { + console.log(stats.toString('errors-only')) // eslint-disable-line no-console + console.log() // eslint-disable-line no-console + console.log(chalk.bgRed.black(' ERROR '), 'Compiling failed!') // eslint-disable-line no-console + } else { + console.log(stats.toString(webpackStats)) // eslint-disable-line no-console + console.log(chalk.bold(`\n> Open http://${host}:${port}\n`)) // eslint-disable-line no-console + console.log(chalk.bgGreen.black(' DONE '), 'Compiled successfully!') // eslint-disable-line no-console + } + console.log() // eslint-disable-line no-console + }) ) const clientCompiler = webpack(clientConfig) // Add the middleware to the instance context this.webpackDevMiddleware = pify(require('webpack-dev-middleware')(clientCompiler, { publicPath: clientConfig.output.publicPath, - stats: { - colors: true, - chunks: false - }, - quiet: false, + stats: webpackStats, + quiet: true, noInfo: true })) - this.webpackHotMiddleware = pify(require('webpack-hot-middleware')(clientCompiler)) + this.webpackHotMiddleware = pify(require('webpack-hot-middleware')(clientCompiler, { + log: () => {} + })) } function webpackWatchAndUpdate () { @@ -363,11 +386,8 @@ function webpackWatchAndUpdate () { const serverCompiler = webpack(serverConfig) const outputPath = join(serverConfig.output.path, serverConfig.output.filename) serverCompiler.outputFileSystem = mfs - this.webpackServerWatcher = serverCompiler.watch({}, (err, stats) => { + this.webpackServerWatcher = serverCompiler.watch({}, (err) => { if (err) throw err - stats = stats.toJson() - stats.errors.forEach(err => console.error(err)) // eslint-disable-line no-console - stats.warnings.forEach(err => console.warn(err)) // eslint-disable-line no-console createRenderer.call(this, mfs.readFileSync(outputPath, 'utf-8')) }) } @@ -378,7 +398,7 @@ function webpackRunClient () { const serverCompiler = webpack(clientConfig) serverCompiler.run((err, stats) => { if (err) return reject(err) - console.log('[nuxt:build:client]\n', stats.toString({ chunks: false, colors: true })) // eslint-disable-line no-console + console.log('[nuxt:build:client]\n', stats.toString(webpackStats)) // eslint-disable-line no-console if (stats.hasErrors()) return reject('Webpack build exited with errors') resolve() }) @@ -391,7 +411,7 @@ function webpackRunServer () { const serverCompiler = webpack(serverConfig) serverCompiler.run((err, stats) => { if (err) return reject(err) - console.log('[nuxt:build:server]\n', stats.toString({ chunks: false, colors: true })) // eslint-disable-line no-console + console.log('[nuxt:build:server]\n', stats.toString(webpackStats)) // eslint-disable-line no-console if (stats.hasErrors()) return reject('Webpack build exited with errors') const bundlePath = join(serverConfig.output.path, serverConfig.output.filename) readFile(bundlePath, 'utf8') diff --git a/package.json b/package.json index ea932cc00e..bd927a9b77 100644 --- a/package.json +++ b/package.json @@ -52,6 +52,7 @@ "babel-core": "^6.22.1", "babel-loader": "^6.2.10", "babel-preset-vue-app": "^0.4.0", + "chalk": "^1.1.3", "chokidar": "^1.6.1", "co": "^4.6.0", "css-loader": "^0.26.1", @@ -67,6 +68,7 @@ "memory-fs": "^0.4.1", "path-to-regexp": "^1.7.0", "pify": "^2.3.0", + "post-compile-webpack-plugin": "^0.1.1", "progress-bar-webpack-plugin": "^1.9.3", "serialize-javascript": "^1.3.0", "serve-static": "^1.11.2",