webpack 的开发者模式 显示asset 详细信息

1, 我把项目从webpack 1.XX 升级了,升级的大版本是3.XX

2,以前的开发者模式,是用webpack-dev-middleware这个组件来实现的,而且那个时候开发者模式比较详细:

clipboard.png会有这些信息,但是我升级webpack到3.XXX之后

使用开发者模式,就没有这样的详情了,因为我要优化项目,比如那些文件过大,需要压缩调整等等。。

现在是这样:

clipboard.png

现在的启动命令这个:
webpack-dev-server --inline --progress --config build/webpack.dev.conf.js

我也查了 webpack-dev-server的文档,没有找到如何配置,显示详细的asset 打包信息
?? 有人遇到过吗?

阅读 3.3k
1 个回答

你贴的webpack-dev-server --inline --progress --config build/webpack.dev.conf.js看起来是开发的指令,不是构建的。
找到运行webpack()构建的js文件。
在webpack的调用里加上process.stdout.write这块。

  webpack(webpackConfig, (err, stats) => {
    spinner.stop()
    if (err) throw err
    //
    process.stdout.write(stats.toString({
      colors: true,
      modules: false,
      children: false, // If you are using ts-loader, setting this to true will make TypeScript errors show up during build.
      chunks: false,
      chunkModules: false
    }) + '\n\n')
    //
    if (stats.hasErrors()) {
      console.log(chalk.red('  Build failed with errors.\n'))
      process.exit(1)
    }

    console.log(chalk.cyan('  Build complete.\n'))
    console.log(chalk.yellow(
      '  Tip: built files are meant to be served over an HTTP server.\n' +
      '  Opening index.html over file:// won\'t work.\n'
    ))
  })
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题