Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Webpack suppress eslint warnings on browser console

I`ve finished configuring my eslint rules and refactoring project files according to my rules. Thing is that I have some warnings that I may want to leave there for a while. But my problem is that warnings are being shown on browser console, what makes development impossible.

enter image description here

Below, my webpack config:

const path = require('path');
const webpack = require('webpack');
const ExtractTextPlugin = require("extract-text-webpack-plugin");
const context = path.resolve('.');


module.exports = {
  context: context,
  entry: './src/client.js',
  output: {
    path: path.join(context, 'build/client'),
    publicPath: '/static/',
    filename: '[name]-[hash].js'
  },
  module: {
    preLoaders: [
      {
        test: /\.js$/,
        exclude: /node_modules/,
        loader: 'eslint-loader'
      },
    ],
    loaders: [{
      test: /(?:node_modules).+\.css$/,
      loader: 'style!css'
    }, {
      test: /\.scss$/,
      loader: ExtractTextPlugin.extract([
        'css-loader',
        'postcss-loader',
        'sass-loader',
        'sass-resources'
      ])
    }, {
      test: /\.js$/,
      loader: 'babel',
      exclude: /(node_modules)/
    }, {
     test: /\.woff(\?v=\d+\.\d+\.\d+)?$/,
     loader: "url?limit=10000&mimetype=application/font-woff"
   }, {
     test: /\.woff2(\?v=\d+\.\d+\.\d+)?$/,
     loader: "url?limit=10000&mimetype=application/font-woff"
   }, {
     test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/,
     loader: "url?limit=10000&mimetype=application/octet-stream"
   }, {
     test: /\.eot(\?v=\d+\.\d+\.\d+)?$/,
     loader: "file"
   }, {
     test: /\.svg(\?v=\d+\.\d+\.\d+)?$/,
     loader: "url?limit=10000&mimetype=image/svg+xml"
   }, {
      test: /\.json$/,
      loader: 'json'
    }]
  },
  postcss: function() {
    return [
      require('autoprefixer')
    ];
  },
  sassResources: [
    path.resolve(__dirname, '../src/stylesheets/base/_variables.scss'),
    path.resolve(__dirname, '../src/stylesheets/base/_mixins.scss')
  ],
  devServer: {
    watchOptions: {
      aggregateTimeout: 1000
    }
  },
  plugins: [
    new ExtractTextPlugin("[name]-[hash].css"),
    new webpack.DefinePlugin({
      'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV || 'local')
    })
  ],
  devtool: "cheap-module-source-map"
};

I have no problem with errors being displayed on browser console, but is there a way to suppress warnings ONLY on browser console and not on the node terminal?

like image 381
Filipe Merker Avatar asked Mar 06 '17 13:03

Filipe Merker


1 Answers

https://devhub.io/repos/coryhouse-eslint-loader

In my webpack.config.js I have options setup:

module: {
  rules: [
    {
      test: /\.js$/,
      exclude: /(node_modules)/,
      use: [
        {
          loader: 'babel-loader',
          options: {
            presets: [
              ['es2015', {modules: false}],
              'react'
            ],
            plugins: [ 'react-hot-loader/babel' ]
          }
        }, {
          loader: 'eslint-loader',
          options: {
            quiet: true
          }
        }
      ]
    }
  ]
}

The last line is quiet: true, which is how it suppresses the warnings.

like image 194
Matt Goo Avatar answered Oct 14 '22 19:10

Matt Goo