Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to disable optimize warnings in webpack 2

I am working with React/Webpack 2 etc. I have Karma test runner and when I run my tests I launch Webpack before, and it throws to the console warning output about size etc. (I can't fix it because it is webpack stuff).

How do I can disable these warnings? I tried to set

stats : "none" but it isn't working.

Thanks for any help

WARNING in ./src/modules/Module1/index.js
There are multiple modules with names that only differ in casing.
This can lead to unexpected behavior when compiling on a filesystem with other case-semantic.
Use equal casing. Compare these module identifiers:
* C:\work\EazeGamesClient\node_modules\babel-loader\lib\index.js!C:\work\EazeGamesClient\node_modules\eslint-loader\index.js?{"fix":true}!C:\work\EazeGamesClient\src\modules\Module1\index.js
* C:\work\EazeGamesClient\node_modules\babel-loader\lib\index.js!C:\work\EazeGamesClient\node_modules\eslint-loader\index.js?{"fix":true}!C:\work\EazeGamesClient\src\modules\module1\index.js
    Used by 1 module(s), i. e.
    C:\work\EazeGamesClient\node_modules\babel-loader\lib\index.js!C:\work\EazeGamesClient\node_modules\eslint-loader\index.js?{"fix":true}!C:\work\EazeGamesClient\src\routes.js

WARNING in ./src/modules/Module1/containers/Module1.container.js
There are multiple modules with names that only differ in casing.
This can lead to unexpected behavior when compiling on a filesystem with other case-semantic.
Use equal casing. Compare these module identifiers:
* C:\work\EazeGamesClient\node_modules\babel-loader\lib\index.js!C:\work\EazeGamesClient\node_modules\eslint-loader\index.js?{"fix":true}!C:\work\EazeGamesClient\src\modules\Module1\containers\Module1.container.js
    Used by 1 module(s), i. e.
    C:\work\EazeGamesClient\node_modules\babel-loader\lib\index.js!C:\work\EazeGamesClient\node_modules\eslint-loader\index.js?{"fix":true}!C:\work\EazeGamesClient\src\modules\Module1\index.js
* C:\work\EazeGamesClient\node_modules\babel-loader\lib\index.js!C:\work\EazeGamesClient\node_modules\eslint-loader\index.js?{"fix":true}!C:\work\EazeGamesClient\src\modules\module1\containers\Module1.container.js
    Used by 1 module(s), i. e.
    C:\work\EazeGamesClient\node_modules\babel-loader\lib\index.js!C:\work\EazeGamesClient\node_modules\eslint-loader\index.js?{"fix":true}!C:\work\EazeGamesClient\src\modules\module1\index.js

WARNING in asset size limit: The following asset(s) exceed the recommended size limit (250 kB).
This can impact web performance.
Assets:
  src/containers/Root.container.js (825 kB)
  src/containers/Root.container.dev.js (821 kB)
  src/store/configureStore.js (629 kB)
  src/store/configureStore.dev.js (628 kB)
  src/containers/DevTools.js (612 kB)
  src/containers/Root.container.prod.js (389 kB)

WARNING in entrypoint size limit: The following entrypoint(s) combined asset size exceeds the recommended limit (250 kB). This can impact web performance.
Entrypoints:
  src/containers/DevTools.js (612 kB)
      src/containers/DevTools.js

  src/containers/Root.container.dev.js (821 kB)
      src/containers/Root.container.dev.js

  src/containers/Root.container.js (825 kB)
      src/containers/Root.container.js

  src/containers/Root.container.prod.js (389 kB)
      src/containers/Root.container.prod.js

  src/store/configureStore.dev.js (628 kB)
      src/store/configureStore.dev.js

  src/store/configureStore.js (629 kB)
      src/store/configureStore.js


WARNING in webpack performance recommendations:
You can limit the size of your bundles by using System.import() or require.ensure to lazy load some parts of your application.
For more info visit https://webpack.js.org/guides/code-splitting/

P.S. Update 1

webpack.testing.config

let process = require("process"),
    autoprefixer = require('autoprefixer'),
    precss = require('precss'),

    webpack = require("webpack"),
    helpers = require("./helpers"),

    ExtractTextPlugin = require("extract-text-webpack-plugin"),
    CssSourcemapPlugin = require("css-sourcemaps-webpack-plugin"),

    srcName = "src";

module.exports = {
    entry : {
        "vendor" : ["react", "react-dom", "react-router", "redux", "react-router-redux"],
        "app" : helpers.root(srcName, "index.js")
    },
    output : {
        path : helpers.root("dist"),
        publicPath : "/",
        filename : "[name].[hash].bundle.js",
        chunkFilename : "[id].[hash].bundle.chunk.js"
    },
    context : helpers.root(srcName),

    module : {
        rules : [
            {
                enforce : 'pre',
                test : /\.jsx?$/,
                loader : 'eslint-loader',
                options: {
                    fix: true,
                },
                include: helpers.root(srcName)
            },
            {
                test : /\.jsx?$/,
                loaders : [
                    'babel-loader',
                ],
                exclude : /node_modules/
            },
            {
                test : /\.css$/,
                loaders : [
                    'style-loader',
                    'css-loader?modules',
                    'postcss-loader',
                ],
            },
        ],
    },

    stats: "none",

    devtool: 'inline-source-map',


    plugins : [
        new webpack.LoaderOptionsPlugin({
            options : {
                eslint : {
                    configFile : '.eslintrc',
                    failOnWarning : false,
                    failOnError : false
                }
            }
        }),
        new CssSourcemapPlugin(),
        new ExtractTextPlugin("[name].[hash].css")
    ],

    performance: {
        hints: false
    }
};
like image 531
Velidan Avatar asked Dec 15 '16 08:12

Velidan


People also ask

How do I turn off console warnings in react?

The Yellow warning box in React Native can be both helpful and annoying. There are many errors that can be ignored but end up blocking necessary pieces of the application. To disable the yellow box place console. disableYellowBox = true; anywhere in your application.

Are Webpacks slow?

Over the past eight years, webpack has become increasingly powerful. However, due to the additional packaging process, the building speed is getting slower as the project grows. As a result, each startup takes dozens of seconds (or minutes), followed by a round of build optimization.


1 Answers

Based on logs, there are two types of warnings

  1. WARNING ... size limit - in order to fix it add to webpack.config option performance

    performance: {
      hints: false
    }
    

    Recommended disable hints in development mode however enable in production mode

  2. WARNING There are multiple modules with names that only differ in casing. - seems this warning related to Windows OS, there is issue on github where discussed this problem

like image 181
Oleksandr T. Avatar answered Oct 24 '22 11:10

Oleksandr T.