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.

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

bower support #159

Closed
konsumer opened this issue Oct 22, 2014 · 6 comments
Closed

bower support #159

konsumer opened this issue Oct 22, 2014 · 6 comments
Labels

Comments

@konsumer
Copy link

@konsumer konsumer commented Oct 22, 2014

I can't figure out how to make this work easily in my grunt/bower/browserify setup. bower would make the process much easier.

@feross feross added the area/browser label Oct 25, 2014
@feross

This comment has been minimized.

Copy link
Member

@feross feross commented Oct 25, 2014

Sure – published to bower as webtorrent.

But I should say: I think bower is a bad idea. npm is for all javascript, server and client. Lots of javascript works in both places, and segmenting the client-side stuff into a separate silo is silly.

WebTorrent is a perfect example of a module that works on the server and client. Wherever you plan to use it, you can get it from npm. :)

@feross feross closed this Oct 25, 2014
@konsumer

This comment has been minimized.

Copy link
Author

@konsumer konsumer commented Oct 26, 2014

bower tracks css & js dependencies, so for most, I think it's better for client-side dep-tracking. I guess I could stop using it, rewrite my build system to use npm & browserify (which doesn't properly track just what is for client-side vs server-side deps,) and manually include all the CSS, but I think bower makes more sense for me.

@konsumer

This comment has been minimized.

Copy link
Author

@konsumer konsumer commented Oct 26, 2014

I think you will also need a bower.json (to define your main) & version tagging. I am happy to submit a pull-request when I have a bit more time.

@konsumer

This comment has been minimized.

Copy link
Author

@konsumer konsumer commented Oct 26, 2014

As an example of how I want to use it bower, I am working on this. I want to use it client-side, so it'd be simplest for me to just say bower install --save webtorrent, and it would be added to my site js file, and be minified in my main site build, via the bower.json. With an npm install, it becomes a project server-side dependency (incorrectly) and there is another step of turning it into client-side js via browserify to be injected in my vendor javascript file.

@feross

This comment has been minimized.

Copy link
Member

@feross feross commented Oct 26, 2014

bower tracks css & js dependencies

You can actually include css, html, or any kind of file you want in an npm package! Does bower handle css specially? Last time I used it (~2 years ago), it didn't do anything special, css were just files inside the package folder.

With an npm install, it becomes a project server-side dependency (incorrectly) and there is another step of turning it into client-side js via browserify to be injected in my vendor javascript file.

If you want to get the most out of browserify, you won't merely use it to compile npm packages into browser components - you'll build your whole app out of npm packages. Take a look at client/index.js in Instant.io to see how you can use browserify to bundle your whole application, without needing gulp, bower, or anything like that.

Also, npm install doesn't mean it's a server-side dependency. It downloads a package and all of it's dependencies to your filesystem. Then you can require it in node if you want to use it there. If you never require it, then it won't get loaded.

browserify doesn't properly track just what is for client-side vs server-side deps

Browserify only bundles the files that you explicitly require, so if you npm install express but never require it in your client-side code, then it won't be bundled. It traverses the require graph and only includes the necessary files.

@konsumer

This comment has been minimized.

Copy link
Author

@konsumer konsumer commented Oct 26, 2014

You can actually include css, html, or any kind of file you want in an npm package!

o rly!?! It's not tracked, though. This means that when I have an auto-building grunt, gulp, brunch, etc setup, it will work automatically with lots of other packages, but not yours.

Take a look at client/index.js in Instant.io to see how you can use browserify to bundle your whole application, without needing gulp, bower, or anything like that.

I still use CSS/JS minification, LESS, SASS, and sometimes even coffeescript (though it's not a personal favorite) in production, on most client-work. If I were using your thing, I would still need a makefile/shell-script, some CLI utils, and some documentation to make it ready for my team. With build systems a lot of that stuff is abstracted away, so you don't need to be so concerned with other people's things. You can just code your lil thing, and have it work right, and release in the format you need to.

Also, npm install doesn't mean it's a server-side dependency. It downloads a package and all of it's dependencies to your filesystem. Then you can require it in node if you want to use it there. If you never require it, then it won't get loaded.

It will still be downloaded by npm, and your client-side entry point (versus server-side) & css will not be tracked properly, which means more code in the build script to deal with all the special lil snowflake libs weirdly particular way of packaging things to get things the way you need.

Last time I used it (~2 years ago), it didn't do anything special, css were just files inside the package folder.

It's up to the consumer. There are good packages for grunt, gulp, and brunch has native support for CSS & JS main.

Browserify only bundles the files that you explicitly require, so if you npm install express but never require it in your client-side code, then it won't be bundled. It traverses the require graph and only includes the necessary files.

Seriously, dude, I know how browserify, npm, & CommonJS work. Check out my work on github. You are missing my point, and I can only assume this is an intentional attempt at a straw-man, as it seems so very blatantly obvious to me why this is a smart way to separate things, and even if you don't agree you must have heard of this by now, as it's a pretty popular way to do stuff. If you don't agree, feel free to do it your own special lil snowflake way. You can still allow others to use it with bower, even if you hate bower with a rage that burns brighter than a thousand suns, or alternately, wait to be forked and used in bower by someone else who actually wants to use webtorrent.

@lock lock bot locked as resolved and limited conversation to collaborators May 7, 2018
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Linked pull requests

Successfully merging a pull request may close this issue.

None yet
2 participants
You can’t perform that action at this time.