webpack-dashboard是用于改善开发人员使用webpack时控制台用户体验的一款工具。
它摒弃了webpack（尤其是使用dev server时）在命令行内诸多杂乱的信息结构，为webpack在命令行上构建了一个一目了然的仪表盘(dashboard)，其中包括构建过程和状态、日志以及涉及的模块列表。
有了它，你就可以更加优雅的使用webpack来构建你的代码。
webpack-dashboard安装
npm install webpack-dashboard --save-dev
webpack-dashboard使用
首先，导入dashboard和其对应的插件，并创建一个dashboard的实例：
const Dashboard = require('webpack-dashboard');
const DashboardPlugin = require('webpack-dashboard/plugin');
const dashboard = new Dashboard();
然后，在对应的plugins里面添加DashboardPlugin：
plugins: [
new DashboardPlugin(dashboard.setData)
]
最后，你需要让dev server在静默的状态中启动（主要是为了去掉多余的日志），要实现这一点，你可以像官方的做法那样，在WebpackDevServer的构造函数里添加 quiet: true。
new WebpackDevServer(
Webpack(settings),
{
publicPath: settings.output.publicPath,
hot: true,
quiet: true, // lets WebpackDashboard do its thing
historyapiFallback: true,
}
).listen
当然，你也可以在npm的script里面启动dev server时添加quiet选项（我在尝试的时候选择这种简单的方式）。
"scripts": {
"start": "webpack-dev-server --quiet"
},
这样，你就可以运行诸如npm start这样的命令启动你的server。
仅供个人学习参考/导航指引使用，具体请以第三方网站说明为准，本站不提供任何专业建议。如果地址失效或描述有误，请联系站长反馈～感谢您的理解与支持！
链接: https://fly63.com/nav/921
