browserify / wzrd.in

browserify as a service.
http://wzrd.in
MIT License
637 stars 96 forks source link

Things that need peerDeps (like react) fail to build for multibundles #130

Open prakhar1989 opened 8 years ago

prakhar1989 commented 8 years ago

Hi!

Thanks for this fantastic service! I was trying out a package - react-tag-input in ESNext and I got this weird issue in the console. The message directed me to post this here, so that's why I'm here.

``` --- error #0: --- (logs uuid: 52e09ea0-4317-11e6-8c65-79f7842fe37c ) Error: "browserify exited with code 1" code: 1 stderr: Error: Cannot find module 'react-tag-input' from '/tmp/react-tag-input11666-1238-1kr0jwk/node_modules/react-tag-input' at /home/admin/browserify-cdn/node_modules/browserify/node_modules/browser-resolve/node_modules/resolve/lib/async.js:46:17 at process (/home/admin/browserify-cdn/node_modules/browserify/node_modules/browser-resolve/node_modules/resolve/lib/async.js:173:43) at ondir (/home/admin/browserify-cdn/node_modules/browserify/node_modules/browser-resolve/node_modules/resolve/lib/async.js:188:17) at load (/home/admin/browserify-cdn/node_modules/browserify/node_modules/browser-resolve/node_modules/resolve/lib/async.js:69:43) at onex (/home/admin/browserify-cdn/node_modules/browserify/node_modules/browser-resolve/node_modules/resolve/lib/async.js:92:31) at /home/admin/browserify-cdn/node_modules/browserify/node_modules/browser-resolve/node_modules/resolve/lib/async.js:22:47 at Object.oncomplete (fs.js:107:15) dirPath: /tmp/react-tag-input11666-1238-1kr0jwk ------ ```

You can see what I have on ESNextBin here and see the package source here. As a package author, I'd love to give an example of the package usage on ESNextBin, so if you have any ideas on what I can do to make this work, I'll highly appreciate it. Thanks! 👍

jfhbrook commented 8 years ago

Interesting. I would have to play with this more, but a few ideas:

1) Is this related to known problems with peer dependency resolution? I feel like this limitation is really painful for react demos. 2) What API call is esnextbin making? Is there a good way to find that out?

jfhbrook commented 8 years ago

Doesn't matter, I have repro here:

https://wzrd.in/standalone/react-tag-input@latest

3) Could this be related to the fact that I've been putting off upgrading wzrd.in to node 4? D:

jfhbrook commented 8 years ago

package.json looks well-formed but I see a lot of

https://github.com/prakhar1989/react-tags/blob/master/dist-modules/reactTags.js#L5

in the main export. Those can cause problems with browserify.

jfhbrook commented 8 years ago

One thing you can try doing too, is to make a tmpdir, go into it, make a package.json, npm install react-tag-manager and then run node -pe "require('react-tag-manager')" and see what happens?

prakhar1989 commented 8 years ago

Thanks a ton for looking into this so quickly! The above suggestion is the first thing I tried and it seems to work fine -

λ node -pe "require('react-tag-input').WithContext"
{ [Function: DragDropContextContainer]
  DecoratedComponent:
   { [Function]
     displayName: 'ReactTags',
     propTypes:
      { tags: [Object],
        placeholder: [Object],
        labelField: [Object],
        suggestions: [Object],
        delimiters: [Object],
        autofocus: [Object],
        inline: [Object],
        handleDelete: [Function: bound checkType],
        handleAddition: [Function: bound checkType],
        handleDrag: [Object],
        allowDeleteFromEmptyInput: [Object],
        handleInputChange: [Object],
        minQueryLength: [Object],
        shouldRenderSuggestions: [Object],
        removeComponent: [Object],
        autocomplete: [Object],
        readOnly: [Object],
        classNames: [Object] },
     getDefaultProps: { [Function: getDefaultProps] isReactClassApproved: {} },
     defaultProps:
      { placeholder: 'Add new tag',
        tags: [],
        suggestions: [],
        delimiters: [Object],
        autofocus: true,
        inline: true,
        allowDeleteFromEmptyInput: true,
        minQueryLength: 2,
        autocomplete: false,
        readOnly: false } },
  displayName: 'DragDropContext(ReactTags)',
  childContextTypes: { dragDropManager: [Function: bound checkType] } }

Let me know if there's anything else I can provide to help you debug! Thanks =)

jfhbrook commented 8 years ago

It might be a while until I can get back to this, just a heads-up.

prakhar1989 commented 8 years ago

Sure no problem. Really appreciate any time you can put into this! Thank you :) On Jul 5, 2016 10:35 PM, "Joshua Holbrook" notifications@github.com wrote:

It might be a while until I can get back to this, just a heads-up.

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/jfhbrook/wzrd.in/issues/130#issuecomment-230657023, or mute the thread https://github.com/notifications/unsubscribe/AAnoISJ0k-iAXzSNP0gakmDdaQ4sV6CEks5qSxR5gaJpZM4JFrNW .