Qiita Teams that are logged in
You are not logged in to any team

Log in to Qiita Team
Community
OrganizationAdvent CalendarQiitadon (β)
Service
Qiita JobsQiita ZineQiita Blog
Help us understand the problem. What is going on with this article?

webpack-dev-serverのログが見づらい時

More than 1 year has passed since last update.

備忘録です。

webpack-dev-serverで作業時

ほとんどが不要なログのように思ったりします。

$ webpack-dev-server 
ℹ 「wds」: Project is running at http://localhost:8080/
ℹ 「wds」: webpack output is served from /
ℹ 「wds」: Content not from webpack is served from /Users/NC00008197/react_redux

inspect: ul margin 0 auto
inspect: ul margin 0 auto
Child extract-text-webpack-plugin node_modules/extract-text-webpack-plugin/dist node_modules/css-loader/index.js??ref--0-1!node_modules/postcss-loader/lib/index.js!node_modules/sass-loader/lib/loader.js!assets/components/logo/styles/base.scss:
       2 modules
Child extract-text-webpack-plugin node_modules/extract-text-webpack-plugin/dist node_modules/css-loader/index.js??ref--0-1!node_modules/postcss-loader/lib/index.js!node_modules/sass-loader/lib/loader.js!assets/components/navigation/styles/base.scss:
       2 modules
Child extract-text-webpack-plugin node_modules/extract-text-webpack-plugin/dist node_modules/css-loader/index.js??ref--0-1!node_modules/postcss-loader/lib/index.js!node_modules/sass-loader/lib/loader.js!assets/components/navigation/styles/default.scss:
       2 modules
Child extract-text-webpack-plugin node_modules/extract-text-webpack-plugin/dist node_modules/css-loader/index.js??ref--0-1!node_modules/postcss-loader/lib/index.js!node_modules/sass-loader/lib/loader.js!assets/components/panel/styles/base.scss:
       2 modules
Child extract-text-webpack-plugin node_modules/extract-text-webpack-plugin/dist node_modules/css-loader/index.js??ref--0-1!node_modules/postcss-loader/lib/index.js!node_modules/sass-loader/lib/loader.js!assets/components/section/styles/base.scss:
       2 modules
Child extract-text-webpack-plugin node_modules/extract-text-webpack-plugin/dist node_modules/css-loader/index.js??ref--0-1!node_modules/postcss-loader/lib/index.js!node_modules/sass-loader/lib/loader.js!assets/components/section/styles/default.scss:
       2 modules
Child extract-text-webpack-plugin node_modules/extract-text-webpack-plugin/dist node_modules/css-loader/index.js??ref--0-1!node_modules/postcss-loader/lib/index.js!node_modules/sass-loader/lib/loader.js!assets/components/button/styles/base.scss:
       2 modules
Child extract-text-webpack-plugin node_modules/extract-text-webpack-plugin/dist node_modules/css-loader/index.js??ref--0-1!node_modules/postcss-loader/lib/index.js!node_modules/sass-loader/lib/loader.js!assets/components/tab/styles/base.scss:
       2 modules

「Webpackに読み込んでいるプラグインが、何かしました。」という説明のログが出てきて、いちいち読みづらい時があります。

webpack.config.js
export default {
  //省略しています。
  devServer: {
    stats: {
      builtAt: false,
      children: false,
      modules: false,
      version: false
    }
  },
}

これでログがスッキリしました。以上です。

参考記事:

(イシュー)出力ログレベルの冗長性
https://github.com/webpack-contrib/extract-text-webpack-plugin/issues/550
https://webpack.js.org/configuration/stats/

DaisukeNishi
エンジニアに憧れるデザイナーです。性格診断は「INTP」思いやり・社交性に欠ける人。。→ http://xn--16-573d25rtpd1v4e.com/intp.php
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away