Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Output from uglify cannot be traced #161

Closed
yareyaredesuyo opened this issue Dec 4, 2020 · 3 comments · Fixed by #178
Closed

Output from uglify cannot be traced #161

yareyaredesuyo opened this issue Dec 4, 2020 · 3 comments · Fixed by #178
Labels
bug Something isn't working

Comments

@yareyaredesuyo
Copy link

yareyaredesuyo commented Dec 4, 2020 •
edited
Loading

I encountered the propblem when using minfied library in next.js runtime environmennt, it coudnt be loaded property. And it looks like not the problem of uglify.

Following is the way for procedure the problem.

npm init -y
yarn add @vercel/[email protected]
yarn add [email protected]

run nft print

npx nft print ./node_modules/yt-search/dist/yt-search.js

print result

FILELIST:
node_modules/async.parallellimit/index.js
node_modules/async.parallellimit/package.json
node_modules/async.util.eachoflimit/index.js
node_modules/async.util.eachoflimit/package.json
node_modules/async.util.isarray/index.js
node_modules/async.util.isarray/package.json
node_modules/async.util.isarraylike/index.js
node_modules/async.util.isarraylike/package.json
node_modules/async.util.keyiterator/index.js
node_modules/async.util.keyiterator/package.json
node_modules/async.util.keys/index.js
node_modules/async.util.keys/package.json
node_modules/async.util.noop/index.js
node_modules/async.util.noop/package.json
node_modules/async.util.once/index.js
node_modules/async.util.once/package.json
node_modules/async.util.onlyonce/index.js
node_modules/async.util.onlyonce/package.json
node_modules/async.util.parallel/index.js
node_modules/async.util.parallel/package.json
node_modules/async.util.restparam/index.js
node_modules/async.util.restparam/package.json
node_modules/boolbase/index.js
node_modules/boolbase/package.json
node_modules/cheerio/index.js
node_modules/cheerio/lib/api/attributes.js
node_modules/cheerio/lib/api/css.js
node_modules/cheerio/lib/api/forms.js
node_modules/cheerio/lib/api/manipulation.js
node_modules/cheerio/lib/api/traversing.js
node_modules/cheerio/lib/cheerio.js
node_modules/cheerio/lib/parse.js
node_modules/cheerio/lib/static.js
node_modules/cheerio/lib/utils.js
node_modules/cheerio/node_modules/dom-serializer/index.js
node_modules/cheerio/node_modules/dom-serializer/package.json
node_modules/cheerio/package.json
node_modules/css-select/index.js
node_modules/css-select/lib/attributes.js
node_modules/css-select/lib/compile.js
node_modules/css-select/lib/general.js
node_modules/css-select/lib/procedure.json
node_modules/css-select/lib/pseudos.js
node_modules/css-select/lib/sort.js
node_modules/css-select/package.json
node_modules/css-what/index.js
node_modules/css-what/package.json
node_modules/dasu/dist/dasu.min.js
node_modules/dasu/package.json
node_modules/dom-serializer/foreignNames.json
node_modules/dom-serializer/index.js
node_modules/dom-serializer/node_modules/domelementtype/lib/index.js
node_modules/dom-serializer/node_modules/domelementtype/package.json
node_modules/dom-serializer/node_modules/entities/lib/decode.js
node_modules/dom-serializer/node_modules/entities/lib/decode_codepoint.js
node_modules/dom-serializer/node_modules/entities/lib/encode.js
node_modules/dom-serializer/node_modules/entities/lib/index.js
node_modules/dom-serializer/node_modules/entities/lib/maps/decode.json
node_modules/dom-serializer/node_modules/entities/lib/maps/entities.json
node_modules/dom-serializer/node_modules/entities/lib/maps/legacy.json
node_modules/dom-serializer/node_modules/entities/lib/maps/xml.json
node_modules/dom-serializer/node_modules/entities/package.json
node_modules/dom-serializer/package.json
node_modules/domelementtype/index.js
node_modules/domelementtype/package.json
node_modules/domhandler/index.js
node_modules/domhandler/lib/element.js
node_modules/domhandler/lib/node.js
node_modules/domhandler/package.json
node_modules/domutils/index.js
node_modules/domutils/lib/helpers.js
node_modules/domutils/lib/legacy.js
node_modules/domutils/lib/manipulation.js
node_modules/domutils/lib/querying.js
node_modules/domutils/lib/stringify.js
node_modules/domutils/lib/traversal.js
node_modules/domutils/package.json
node_modules/entities/index.js
node_modules/entities/lib/decode.js
node_modules/entities/lib/decode_codepoint.js
node_modules/entities/lib/encode.js
node_modules/entities/maps/decode.json
node_modules/entities/maps/entities.json
node_modules/entities/maps/legacy.json
node_modules/entities/maps/xml.json
node_modules/entities/package.json
node_modules/escodegen/escodegen.js
node_modules/escodegen/package.json
node_modules/esprima/esprima.js
node_modules/esprima/package.json
node_modules/estraverse/estraverse.js
node_modules/estraverse/package.json
node_modules/esutils/lib/ast.js
node_modules/esutils/lib/code.js
node_modules/esutils/lib/keyword.js
node_modules/esutils/lib/utils.js
node_modules/esutils/package.json
node_modules/htmlparser2/lib/CollectingHandler.js
node_modules/htmlparser2/lib/FeedHandler.js
node_modules/htmlparser2/lib/Parser.js
node_modules/htmlparser2/lib/ProxyHandler.js
node_modules/htmlparser2/lib/Stream.js
node_modules/htmlparser2/lib/Tokenizer.js
node_modules/htmlparser2/lib/WritableStream.js
node_modules/htmlparser2/lib/index.js
node_modules/htmlparser2/node_modules/domutils/index.js
node_modules/htmlparser2/node_modules/domutils/lib/helpers.js
node_modules/htmlparser2/node_modules/domutils/lib/legacy.js
node_modules/htmlparser2/node_modules/domutils/lib/manipulation.js
node_modules/htmlparser2/node_modules/domutils/lib/querying.js
node_modules/htmlparser2/node_modules/domutils/lib/stringify.js
node_modules/htmlparser2/node_modules/domutils/lib/traversal.js
node_modules/htmlparser2/node_modules/domutils/package.json
node_modules/htmlparser2/package.json
node_modules/human-time/human.js
node_modules/human-time/package.json
node_modules/inherits/inherits.js
node_modules/inherits/inherits_browser.js
node_modules/inherits/package.json
node_modules/jsonpath/generated/parser.js
node_modules/jsonpath/include/action.js
node_modules/jsonpath/include/module.js
node_modules/jsonpath/index.js
node_modules/jsonpath/lib/aesprim.js
node_modules/jsonpath/lib/dict.js
node_modules/jsonpath/lib/grammar.js
node_modules/jsonpath/lib/handlers.js
node_modules/jsonpath/lib/index.js
node_modules/jsonpath/lib/parser.js
node_modules/jsonpath/lib/slice.js
node_modules/jsonpath/package.json
node_modules/lodash.assignin/index.js
node_modules/lodash.assignin/package.json
node_modules/lodash.bind/index.js
node_modules/lodash.bind/package.json
node_modules/lodash.defaults/index.js
node_modules/lodash.defaults/package.json
node_modules/lodash.filter/index.js
node_modules/lodash.filter/package.json
node_modules/lodash.flatten/index.js
node_modules/lodash.flatten/package.json
node_modules/lodash.foreach/index.js
node_modules/lodash.foreach/package.json
node_modules/lodash.map/index.js
node_modules/lodash.map/package.json
node_modules/lodash.merge/index.js
node_modules/lodash.merge/package.json
node_modules/lodash.pick/index.js
node_modules/lodash.pick/package.json
node_modules/lodash.reduce/index.js
node_modules/lodash.reduce/package.json
node_modules/lodash.reject/index.js
node_modules/lodash.reject/package.json
node_modules/lodash.some/index.js
node_modules/lodash.some/package.json
node_modules/nth-check/compile.js
node_modules/nth-check/index.js
node_modules/nth-check/package.json
node_modules/nth-check/parse.js
node_modules/readable-stream/errors.js
node_modules/readable-stream/lib/_stream_duplex.js
node_modules/readable-stream/lib/_stream_passthrough.js
node_modules/readable-stream/lib/_stream_readable.js
node_modules/readable-stream/lib/_stream_transform.js
node_modules/readable-stream/lib/_stream_writable.js
node_modules/readable-stream/lib/internal/streams/async_iterator.js
node_modules/readable-stream/lib/internal/streams/buffer_list.js
node_modules/readable-stream/lib/internal/streams/destroy.js
node_modules/readable-stream/lib/internal/streams/end-of-stream.js
node_modules/readable-stream/lib/internal/streams/from.js
node_modules/readable-stream/lib/internal/streams/pipeline.js
node_modules/readable-stream/lib/internal/streams/state.js
node_modules/readable-stream/lib/internal/streams/stream.js
node_modules/readable-stream/package.json
node_modules/readable-stream/readable.js
node_modules/safe-buffer/index.js
node_modules/safe-buffer/package.json
node_modules/source-map/lib/array-set.js
node_modules/source-map/lib/base64-vlq.js
node_modules/source-map/lib/base64.js
node_modules/source-map/lib/binary-search.js
node_modules/source-map/lib/mapping-list.js
node_modules/source-map/lib/quick-sort.js
node_modules/source-map/lib/source-map-consumer.js
node_modules/source-map/lib/source-map-generator.js
node_modules/source-map/lib/source-node.js
node_modules/source-map/lib/util.js
node_modules/source-map/package.json
node_modules/source-map/source-map.js
node_modules/static-eval/index.js
node_modules/static-eval/package.json
node_modules/string_decoder/lib/string_decoder.js
node_modules/string_decoder/package.json
node_modules/underscore/package.json
node_modules/underscore/underscore.js
node_modules/util-deprecate/node.js
node_modules/util-deprecate/package.json
node_modules/yt-search/dist/yt-search.js
node_modules/yt-search/package.json

Change yt-search version (minified version)

yarn add [email protected]

run nft print

npx nft print ./node_modules/yt-search/dist/yt-search.min.js

print result

FILELIST:
node_modules/yt-search/dist/yt-search.min.js
node_modules/yt-search/package.json

Hmm, look like nothing loaded..

Related issues:
@yareyaredesuyo yareyaredesuyo changed the title Uglified lib cannot be loaded properly. Uglified lib cannot be loaded property. Dec 4, 2020
@styfle styfle added the bug Something isn't working label Dec 4, 2020
@styfle styfle changed the title Uglified lib cannot be loaded property. Output from uglify cannot be traced Dec 4, 2020
@styfle
Copy link
Member

styfle commented Dec 4, 2020

The problem is that require is mangled, so nft doesn't know about the imported dependencies.

For example, you can see that yt-search.min.js no longer has require('cheerio') like it does in the original yt-search.js.

If you can preserve the require name during minification, it should work.

Note that this will not be a problem for ESM because import is not a variable.

@yareyaredesuyo yareyaredesuyo mentioned this issue Dec 4, 2020
Closed
@yareyaredesuyo
Copy link
Author

Note and tested case, looks like not worked well even though preserving require.

it was tested with no variable renaming (or even compression) whatsoever, just whitespace (& parentheses) removal and vercel still doesn't work.

Thanks for the detailed explanation.

I'm combing over the orignal and minified yt-search.js at the moment to look for potential clues − barring a major eureka I'll give this vercel thing a go.

Meanwhile if you don't mind, please try disabling some optimisation flags to see if it makes a difference, e.g. uglifyjs dist/yt-search.js -c inline=false -o dist/yt-search.min.js

The usual suspects I'd go for:

* `collapse_vars`

* `inline`

* `merge_vars`

* `reduce_vars`

mishoo/UglifyJS#4327 (comment)

-c inline=false still errors: vercel-next-yt-search-test-63050iwyr.vercel.app/api/hello

-c collapse_vars=false still errors: vercel-next-yt-search-test-8c6g0ai1b.vercel.app/api/hello

-c merge_vars=false still errors: vercel-next-yt-search-test-9nhczlhqd.vercel.app/api/hello

-c reduce_vars=false still errors: vercel-next-yt-search-test-3m8aedoj9.vercel.app/api/hello

-c collapse_vars=false -c inline=false -c merge_vars=false -c reduce_vars=false still error: vercel-next-yt-search-test-pchgqle60.vercel.app/api/hello

and just to test the non-minified version again I reuploaded and redeployed it and it's working: vercel-next-yt-search-test-ec3kz1q3n.vercel.app/api/hello

EDIT: made the links clickable

mishoo/UglifyJS#4327 (comment)

I see − in which case my current suspicion is that vercel may have some hard-coded pattern replacement of browserify's require code string for some internal optimisation purposes.

The original file has extra whitespace around = on the first line here:

g.ytSearch = f()
          ^ ^

and extra parenthesis around here:

return (function(){function r(e,n,t){
       ^

Although there is nothing wrong with the functionality of the minified code, if vercel is looking for an exact string match, then this would explain the failure we are observing here, i.e. code only fails when hosted on their platform.

mishoo/UglifyJS#4327 (comment)

Clearly it's more than just preserving the name require, since in #4327 (comment) it was tested with no variable renaming (or even compression) whatsoever, just whitespace (& parentheses) removal and vercel still doesn't work.

mishoo/UglifyJS#4327 (comment)

@guybedford
Copy link
Contributor

There is a hard-coding of the Browserify-style wrapper for the AST in https://github.com/vercel/nft/blob/master/src/utils/wrappers.ts#L111. So adjustments to the wrapper might break this detection. It may be a quick fix to handle the extra wrapping even.

@guybedford guybedford mentioned this issue Mar 21, 2021
Merged
@kodiakhq kodiakhq bot closed this as completed in #178 Mar 21, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
bug Something isn't working
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

fix: minified browserify wrapper handling vercel/nft
3 participants
@styfle @guybedford @yareyaredesuyo