Trying to understand 'Add To Library'

If I add a number of components (either ones I've created myself and those created by others), I get a whole bunch of js and css files added to the project - basically one small css and js file for each library component. Is this the way it's supposed to work?

Because on export, if I build a long page with a number of library components I'm left with a ton of small files. Is this correct? Is there no way to compile all the css into one file?

Thanks

Aaron

Yes this is the way it works as each component you create and add to library will bring across the associated css and js so that it can be used by others.

If you don't want to have a raft of css and js files on export, you will have to manually consolidate all the css and js in your own custom files within your design.

That's what I would do.

If I have a lot of CSS, that I don't want, I add all the components to one DIV and then I add it to the local library.

I don't click the hole CSS-file while adding to Lib, so all unused CSS are not added.

At a new BTS-Design I add this new Lib, and all the other CSS are gone.

@Frank, that's a pretty nice trick, thanks for sharing that idea!

The other thing to keep in mind is that if you are using your "own" components that you have created, you probably already have all the JS and CSS in your custom files already and don't need it again. If you're sure of this, AND you are not planning to use it for other projects, just uncheck the JS and CSS checkboxes that show up when you're saving a component of your own to the library. This will keep it from importing those files to your project. This "was" a great thing when we couldn't copy things from one page/project to the next. I imagine this tip will be no longer needed since we can now copy from page to page and project to project.

Thank you. Makes perfect sense now. As I usually start projects from a few themes, I can just import my js and css full files and only have the html as library components. This will streamline things for me nicely.

Frank, I didn't quite understand how you manage adding library components. Are you saying you manually check only the css classes applied to your library html versus selecting the entire stylesheet?

Thanks again.

Aaron

Hiya Bradshaw,

I think (providing I understand him correct, and think I do lol), that he means he adds whatever he wants into his site for components then he puts them all into a single div area (maybe make a backup so you can reference it after you do this?), and puts them all in there when he's got what he needs. He then creates his own component by selecting that div. Then delete the components that are in that div, and add the new component. Now you have all the components without all the extra files. You will probably have 1 JS and 1 CSS file that copies in then instead of numerous ones. This makes it much easier to copy over the JS and CSS content to your custom files.

If I'm understanding him right of course, but it's actually a pretty slick idea. Hopefully a future build will allow us to choose if we want to combine the JS and/or CSS or not. I say choose only because some things you will need to alter to do this or it will overwrite your custom settings if they have the same name. Not all component creators think about the fact that you need a unique prefix or suffix added to the classes and/or ID's so that there isn't the possibility of conflict.

Anyways, I'm pretty sure that's what he means and it's pretty smart thinking!

@bradshaw

e.g.:

I make a new Design

then I insert some customer Online Components (5*)

Now, I normally have 6 CSS Styles (the standard styles.css and the 5 new ones)

These 5 Components I put in one DIV, or SECTION, or something...

This newly created DIV is now to add to the library by right-clicking.

The "Create New Component" Window now marked all CSS parts, that are used. Same with the images, stylesheets, Fonts. Sometimes there are more images, Fonts, Styles, Java in the file, that are not used. In the Window you can see all of them, but no mark on it. So I normaly leave all the marks as the are, no makr at the stylesheets, and click on "create"

In a NEW Design, I add this newly created Component, and all the unused old stuff is gone.

@Jo I think you unterstood right :)

And with these "workarounds" I can work quickly with BTS