Comments (13)
I'm all for stricter rules 🤘
Only accepting 1 file per ext type sounds like a good idea, especially 1 js file, but are there any obvious downsides to this?
I think having a spec for component.json is essential if we want others to embrace it in the future. Maybe even do the same as npm and create a reusable module for loading the component.json?
from bower.
+1 on better defined main
prop. I myself am a little confused on the best values for it right now. Also knowing how it will be used will certainly help me, and others, understand.
from bower.
How should a project similar to Twitter Bootstrap be configured for Bower? It has runtime requirements of two images and two css files in addition to the production js file. Should Bootstrap be split over multiple repos somehow? Or would some additional flexibility to allow more files for situations like these be warranted?
from bower.
Here's a shot at the spec for main
:
main
contains a list of the required files for a package to function at its most basic level. These files are listed with bower list
, so they can be easily managed and compressed for production together with other package's files.
Keep optional files that provide additional functionality or styling out of main
. Bower will still include these files in your package, so users can manually add them to their applications if they so desire.
For now, my preference is to keep it lax main
's strictness. You should be able to list multiple files of the same filetype. This encourages people to break up their packages source into more files which is a win for encapsulation.
I'm on the fence on whether or not you should have to list JS, CSS, and template files separately like you do in component
from bower.
I don't think allowing multiple files of the same type in main is a good idea.
For me, main
implies a reference from the package name and a referenced. This mirrors npm's main
intent that requiring that package pulls in that single referenced file.
I don't think bower should be in the business of trying to concatenate peoples scripts for them if they have multiple main files.
Examples
Importing QUnit main's css file - https://github.com/components/qunit
@import "qunit" // references components/qunit/qunit.css
Require.JS with jQuery - https://github.com/components/jquery
require(["jquery"], function($) {
// references components/jquery/jquery.js
});
With yeoman, the main file is cp'd into your scripts directory, and you can reference it directly.
Multiple files
I think encouraging people to break up files is a good thing, but I think thats a separate concern from the main reference. And I don't think bower is doing a good job of this right now.
Using Modernizr as an example, modernizr.js
clearly maps to the main
file. But its not clear how all the other feature-detects/
fit in. How would copy installers like yeoman know the difference between that directory or the tests directory.
It also be nice if we could improve the reference logic paths for those file w/o forcing Modernizr into a specific directory structure.
Require.JS
require(["modernizr", "modernizr/canvas"], function() {
// references components/modernizr/modernizr.js
// references components/modernizr/feature-detects/canvas.js
});
Yeoman
script references
<script src="modernizr.js">
<script src="modernizr/canvas.js">
In order to have this work in my modernizr shim repo (https://github.com/josh/sprockets-modernizr), I had to put all the files at the root, which is kinda nasty.
Instead of a .bowerignore
#88 file, we might want to consider a whitelisting file manifest approach.
{ "name": "modernizr",
"main": "./modernizr.js",
"paths": {
"cors": "./feature-detects/cors.js",
"css-boxsizing": "./feature-detects/css-boxsizing.js"
...
}
}
from bower.
Regarding "main" property and other ways to export stuff from a Bower package.
Consider Twitter Bootstrap library. One can use just pre-compiled ("main") version:
{
...
"main": [
"./docs/assets/js/bootstrap.js",
"./docs/assets/css/bootstrap.css",
"./img/glyphicons-halflings.png"
],
}
or a customized version of it. It'll be very beneficial to support both use-cases.
@josh already mentioned paths
for JavaScript files. I wonder whether his solution can be extended to support other assets like LESS/SASS/CSS or images as follows:
{
...
"paths": {
"js": {
"affix": "./js/bootstrap-affix.js",
"modal": "./js/bootstrap-modal.js",
...
},
"sass": {
"src": [ "./lib" ]
},
"img": {
"src": [ "./img" ]
}
}
...
}
In this case it'll be very easy for Bower to distinguish between different asset types and provide accurate information to downstream tools like SASS compiler.
Thoughts?
from bower.
Configs like
{
"paths": {
"cors": "./feature-detects/cors.js",
"css-boxsizing": "./feature-detects/css-boxsizing.js"
...
}
}
or
{
"paths": {
"affix": "./js/bootstrap-affix.js",
"modal": "./js/bootstrap-modal.js",
...
}
}
can be simplified if we add regex support:
{
"paths": {
"{module}": "./feature-detects/{module}.js"
}
}
{
"paths": {
"{module}": "./js/bootstrap-{module}.js"
}
}
from bower.
Additional consideration for Bootstrap: a site could easily use both glyphicons-halflings.png and glyphicons-halflings-white.png
Also, for official templates such as the one at http://twitter.github.com/bootstrap/examples/starter-template.html bootstrap.css and bootstrap-responsive.css are included separately with a style block between them to support the template layout. It may be difficult to replicate that if the css were combined.
from bower.
Hi there,
I've implemented grunt plugin for Bower based on idea of bower-installer by @blittle.
The part which manipulates paths is abstracted from copying and other stuff. Hopefully, if Bower's core team decide to add a new section to component.json
(bower.json
) to describe different types of assets, then I can port the code and submit a PR quickly.
This section is called "exportsOverride"
because it overrides imaginary "exports"
in Bower's packages.
from bower.
To @adamalex 's point, I don't see how you could only have one file per type and still have bootstrap function. If you want to use bootstrap-responsive.css you'll need both css files. The same goes for the glyphicon pngs. Would you really want to split bootstrap into 4 repos just for 2 css files and 2 png files...?
Admittedly my experience with the main
property is pretty limited so maybe I'm missing the point.
from bower.
I can understand limiting the files in the main property to one .js file and one .css file because the main .js file can use RequireJS to refer to others and the main .css file can use @import to refer to others. However, I don't understand that limitation on other file types such as images. This seems to force creation of a single sprite image that combines all of them. I have never created such a file, but I'm guessing that isn't easy to do for every image file type.
from bower.
Things are being documented over here:
https://docs.google.com/document/d/1APq7oA9tNao1UYWyOm8dKqlRP2blVkROYLZ2fLIjtWc/edit#heading=h.et2qzfg7dk01
On Thu, Mar 14, 2013 at 2:30 PM, Mark Volkmann [email protected]:
I can understand limiting the files in the main property to one .js file
and one .css file because the main .js file can use RequireJS to refer to
others and the main .css file can use @import https://github.com/importto refer to others. However, I don't understand that limitation on other
file types such as images. This seems to force creation of a single sprite
image that combines all of them. I have never created such a file, but I'm
guessing that isn't easy to do for every image file type.—
Reply to this email directly or view it on GitHubhttps://github.com//issues/46#issuecomment-14930479
.
from bower.
Closing - all spec work is being done in #110 now. Please, comment on the spec and make longer suggestions in the issue thread over there :)
from bower.
Related Issues (20)
- Failed to Install Bower Packages - git exit code 128 HOT 1
- BROKEN CHANGE!! 1.8.8 to 1.8.10 HOT 4
- error since bower update to 1.8.11 HOT 6
- bower 1.8.12 build failure HOT 4
- Currently uses a version of handlebars that contains a critical vulnerability HOT 1
- Usage of Vulnerable version of configstore module and depricated request module HOT 1
- Cloning into 'discover'... fatal: unable to access 'https://github.com/leebaird/discover.git/': Could not resolve host: github.com HOT 2
- it's saying here github is normal and git is Normal HOT 1
- Git clone not working on kali linux 1.unable to access 2ssh: Could not resolve hostname github.com: Temporary failure in name resolution HOT 4
- CERT_HAS_EXPIRED certificate has expired is thrown when I'm trying to update sinon package HOT 40
- git:// no longer supported by github HOT 2
- Update "minimist" dependency in bower-config
- bower.io search page is broken HOT 1
- Update "mout" dependency
- EMALFORMED Failed to read .bower.json HOT 1
- CERT_HAS_EXPIRED Request to https://registry.bower.io/packages/jquery failed: certificate has expired HOT 13
- bower angular-resource#~1.3.7 CERT_HAS_EXPIRED Request to https://registry.bower.io/packages/angular-resource failed: certificate has expired
- CERT_HAS_EXPIRED Request to https://registry.bower.io/packages/jquery HOT 2
- Ubuntu server 22.04 errors
- CERT HAS EXPIRED HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from bower.