mirror of
https://github.com/nuxt/nuxt.git
synced 2024-11-11 08:33:53 +00:00
use webpackbar
This commit is contained in:
parent
1204ea45d4
commit
06067bf099
@ -5,13 +5,13 @@ import webpack from 'webpack'
|
||||
import _ from 'lodash'
|
||||
import VueLoader from 'vue-loader'
|
||||
import MiniCssExtractPlugin from 'mini-css-extract-plugin'
|
||||
import WebpackBar from 'webpackbar'
|
||||
|
||||
import { isUrl, urlJoin } from '../../common/utils'
|
||||
|
||||
import customLoaders from './loaders'
|
||||
import StyleLoader from './utils/style-loader'
|
||||
import WarnFixPlugin from './plugins/warnfix'
|
||||
import ProgressPlugin from './plugins/progress'
|
||||
import StatsPlugin from './plugins/stats'
|
||||
|
||||
export default class WebpackBaseConfig {
|
||||
@ -212,8 +212,7 @@ export default class WebpackBaseConfig {
|
||||
plugins.push(new webpack.ProgressPlugin({ profile: true }))
|
||||
} else {
|
||||
if (!(this.options.minimalCLI)) {
|
||||
plugins.push(new ProgressPlugin({
|
||||
spinner: this.spinner,
|
||||
plugins.push(new WebpackBar({
|
||||
name: this.isServer ? 'server' : 'client',
|
||||
color: this.isServer ? 'orange' : 'green'
|
||||
}))
|
||||
|
@ -1,94 +0,0 @@
|
||||
import webpack from 'webpack'
|
||||
import chalk from 'chalk'
|
||||
import _ from 'lodash'
|
||||
import logUpdate from 'log-update'
|
||||
|
||||
const sharedState = {}
|
||||
|
||||
const BAR_LENGTH = 25
|
||||
const IS_WINDOWS = /^win/.test(process.platform)
|
||||
const BLOCK_CHAR = IS_WINDOWS ? ' ' : '█'
|
||||
const BLOCK_CHAR2 = IS_WINDOWS ? '=' : '█'
|
||||
const ICON_CHAR = IS_WINDOWS ? ':' : '⠸'
|
||||
const BAR_BEFORE = IS_WINDOWS ? chalk.grey('[') : ''
|
||||
const BAR_AFTER = IS_WINDOWS ? chalk.grey(']') : ''
|
||||
|
||||
export default class ProgressPlugin extends webpack.ProgressPlugin {
|
||||
constructor(options) {
|
||||
super(options)
|
||||
|
||||
this.handler = (percent, msg, ...details) => this.updateProgress(percent, msg, details)
|
||||
|
||||
this.handler = _.throttle(this.handler, 25, { leading: true, trailing: true })
|
||||
|
||||
this.options = options
|
||||
|
||||
if (!sharedState[options.name]) {
|
||||
sharedState[options.name] = {
|
||||
color: options.color
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
apply(compiler) {
|
||||
super.apply(compiler)
|
||||
|
||||
compiler.hooks.done.tap('progress', () => logUpdate.clear())
|
||||
}
|
||||
|
||||
get state() {
|
||||
return sharedState[this.options.name]
|
||||
}
|
||||
|
||||
updateProgress(percent, msg, details) {
|
||||
const progress = Math.floor(percent * 100)
|
||||
|
||||
this.state.progress = progress
|
||||
this.state.msg = msg
|
||||
this.state.details = details
|
||||
this.state.isRunning = (progress && progress !== 100) && (msg && msg.length)
|
||||
|
||||
// Process all states
|
||||
let isRunning = false
|
||||
|
||||
const lines = []
|
||||
|
||||
_.sortBy(Object.keys(sharedState), s => s.name).reverse().forEach(name => {
|
||||
const state = sharedState[name]
|
||||
|
||||
if (state.isRunning) {
|
||||
isRunning = true
|
||||
} else {
|
||||
return
|
||||
}
|
||||
|
||||
const _color = chalk.keyword(state.color)
|
||||
|
||||
const _icon = _color(ICON_CHAR)
|
||||
const _name = _color(_.startCase(name))
|
||||
const _bar = this._renderBar(state.progress, state.color)
|
||||
const _msg = chalk.grey(_.startCase(state.msg))
|
||||
const _progress = chalk.grey('(' + state.progress + '%)')
|
||||
|
||||
lines.push([_icon, _name, _bar, _msg, _progress].join(' '))
|
||||
})
|
||||
|
||||
if (!isRunning) {
|
||||
logUpdate.clear()
|
||||
} else {
|
||||
const title = chalk.bgBlue.black('BUILDING')
|
||||
|
||||
logUpdate('\n' + title + '\n\n' + lines.join('\n'))
|
||||
}
|
||||
}
|
||||
|
||||
_renderBar(progress, color) {
|
||||
const w = progress * (BAR_LENGTH / 100)
|
||||
const bg = chalk.white(BLOCK_CHAR)
|
||||
const fg = chalk.keyword(color)(BLOCK_CHAR2)
|
||||
|
||||
return BAR_BEFORE +
|
||||
_.range(BAR_LENGTH).map(i => i < w ? fg : bg).join('') +
|
||||
BAR_AFTER
|
||||
}
|
||||
}
|
@ -118,7 +118,8 @@
|
||||
"webpack-bundle-analyzer": "^2.11.1",
|
||||
"webpack-dev-middleware": "^3.0.1",
|
||||
"webpack-hot-middleware": "^2.21.2",
|
||||
"webpack-node-externals": "^1.6.0"
|
||||
"webpack-node-externals": "^1.6.0",
|
||||
"webpackbar": "^1.0.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"babel-eslint": "^8.2.1",
|
||||
|
@ -7537,6 +7537,15 @@ webpack@^4.2.0:
|
||||
watchpack "^1.5.0"
|
||||
webpack-sources "^1.0.1"
|
||||
|
||||
webpackbar@^1.0.0:
|
||||
version "1.0.0"
|
||||
resolved "https://registry.yarnpkg.com/webpackbar/-/webpackbar-1.0.0.tgz#9dd1dcc8c1744233156798d6c882a7ed1d02cc4d"
|
||||
dependencies:
|
||||
chalk "^2.3.2"
|
||||
figures "^2.0.0"
|
||||
lodash "^4.17.5"
|
||||
log-update "^2.3.0"
|
||||
|
||||
whatwg-encoding@^1.0.1, whatwg-encoding@^1.0.3:
|
||||
version "1.0.3"
|
||||
resolved "https://registry.yarnpkg.com/whatwg-encoding/-/whatwg-encoding-1.0.3.tgz#57c235bc8657e914d24e1a397d3c82daee0a6ba3"
|
||||
|
Loading…
Reference in New Issue
Block a user