How to approach solving webpack ERROR / WARNING messages?

I was recently introduced to a project where it is leveraging the React Boilerplate located here:

After getting the initial project “set up” taken care of, upon running yarn, I’m greeted with a large amount of WARNING and ERROR output. As some may know, it won’t necessarily “fail” due to these errors, which may be the reason that the end of the yarn installation, I’m greeted with “✨ Done in 45.17s.

I’ve listed one of each instance (Warning/Error) below – if you’d like to review a complete list of them, use this link.

Warning –

WARNING in ./~/win-release/index.js
Module not found: Error: Can't resolve 'child_process' in '~/ProjectDir/node_modules/win-release'
 @ ./~/win-release/index.js 26:31-55
 @ ./~/os-name/index.js
 @ ./~/snyk/lib/analytics.js
 @ ./~/snyk/lib/monitor.js
 @ ./~/snyk/lib/index.js
 @ dll reactBoilerplateDeps

Error –

ERROR in ./~/joi/lib/string.js
Module not found: Error: Can't resolve 'net' in '~/ProjectDir/node_modules/joi/lib'
 @ ./~/joi/lib/string.js 3:10-24
 @ ./~/joi/lib/index.js
 @ ./~/nsp/lib/check.js
 @ ./~/nsp/lib/index.js
 @ dll reactBoilerplateDeps

Question:
Since I’m relatively new to this project (and webpack), I’m wondering how I “should” perceive these errors and how I may isolate the cause and resolve them going forward. I may be approaching this incorrectly, however, I’m trying to understand why they have been introduced and (in some circumstances) I’m the only one incurring the Warning/Errors.

Any advice as to why, what, or how to resolve these issues, would be greatly appreciated. I’ve done a great deal of google-ing and haven’t found much aligned with the current circumstances.

On-going solution exploration:

1) As suggested by @proti on StackOverflow

$ npm cache clean

npm ERR! As of npm@5, the npm cache self-heals from corruption issues and data extracted from the cache is guaranteed to be valid. If you want to make sure everything is consistent, use 'npm cache verify' instead.
npm ERR!
npm ERR! If you're sure you want to delete the entire cache, rerun this command with --force.

npm ERR! A complete log of this run can be found in:
npm ERR!     ~/.npm/_logs/2017-10-24T18_03_30_905Z-debug.log

$ npm cache verify

Cache verified and compressed (~/.npm/_cacache):
Content verified: 0 (0 bytes)
Index entries: 0
Finished in 0.01s

2) Attempted to run a ./internals/scripts/analyze.js (source) through Node, which in turn generated a stats.json file, which I leveraged here. It appears isn’t reporting any of these issues, in fact, it claims it’s only incurring a single warning? Is this stuff purposely complicated..?

enter image description here

Author: Fantashit

1 thought on “How to approach solving webpack ERROR / WARNING messages?

  1. If your projects compiles and works, so these warnings are ‘noisy’ (albeit form the posted messages, they seem worrying to me (see below*)) use

    webpack.config.js

    const config = {
       stats: {
        errors: false, // ⚠️  Absolutely not recommended
        warnings: false
      }
    }

    to surpress them from being logged to the console. See Stats for more info.

    * According to the warning/error messages the node core modules polyfills/mocks are currently missing or if not ‘polyfillable/mockabale’ you are using a module as dependency, which simply won’t work in the browser due to missing node internals for that particular dependency. See Node for more info.

    webpack.config.js

    const config = {
      node: {
        fs: 'empty',
        net: 'mock', // not sure if there is a working pollyfill/mock
      }
    }

Comments are closed.