Why does uglify-js report 'WARN: Output exceeds 32000 characters'?

Question

• build pipeline is: Typescript, browserify, browserify-css, uglify.
• runtime libraries: react, bootstrap.

My application so far has very little functionality (that's why I'm asking if this is going to bite me later, even though it appears to work for now). Later on it will get bigger (react-router, redux, other js libraries like Auth0, maybe even some actual functionality.)

I have an app.css that contains:

@import url("node_modules/bootstrap/dist/css/bootstrap.css");

I then import that into my index.tsx with:

import './app.css';

This all appears to work in that my helloworld react component displays "hello world".

But, during the build, uglify reports:

WARN: Output exceeds 32000 characters

Should I ignore it? And if so, is there a way to suppress it?

Looking at the file produced by uglify shows that it seems to make sure no lines are > 32000 characters - most lines truncate at just short of 32000 (one at 31999).

But there's one line var css='/*!\n * Bootstrap v3.3.7 ...' that is 120K characters long. I assume this is what Uglify is trying to tell me, but what's the big deal?

Answer 1

As per DavidG's comment, you can tell Uglify not to complain about this with the max-line-len option.

But, you can't just add that option, because it only works if you're "beautifying" the code. Which then does other stuff that you may not want to do.

The solution to that is to use the -b option to enable beautification, but then tell Uglify not to actually beautify. o_O

"scripts": {
  "uglifyjs":"uglifyjs -b beautify=false,max-line-len=120000"
}

The above will set the line length to 120K - which made the warning go away.

This is more of a workaround than an answer though - it answers the "how do I suppress it" part of my question. I still don't know why it's warning me about that - problems with older browsers or whatever, I don't know.