package - How not to repeat code using Bower and Gulp? -


i use bower manage front end packages on project , gulp minify , create single file css , js packages. saves file on assets folder, files on html.

right now, bower list

├── cssfx#0.9.6 ├── font-awesome#4.3.0 ├── jquery#2.1.3 ├─┬ jquery.cookie#1.4.1 │ └── jquery#2.1.3 ├── jquery.ellipsis#0.7.1 ├── normalize.css#3.0.3 └─┬ semantic-ui#1.12.0   └── jquery#2.1.3 

as can see, have semantic ui , normalize.css installed. problem semantic ui uses normalize.css reset, normalize.css included in semantic ui code. on css file generated gulp, normalize.css included twice, problem because:

  • the code repeating, making file bigger
  • semantic ui uses normalize.css v3.0.1, , normalize.css installed bower v3.0.3

this first time happens me, let's use package includes package have installed, , situation same above. believe solution have valid packages.

is there way remove automatically repeated code? in case above, remove normalize.css semantic ui , use installed normalize.css package?

if can't done, way remove repeated code manually or there's package manager bower or gulp has feature?

there gulp task named gulp-minify-css acts wrapper clean-css: https://github.com/jonathanepollack/gulp-minify-css

for grunt, clean-css wrapper named grunt-contrib-cssmin: https://github.com/gruntjs/grunt-contrib-cssmin

the underlying module (clean-css) different simple minification in there options combine property declarations , eliminate declarations overridden later ones. haven't tested myself, imagine eliminate redundancies in css caused double inclusion of (almost) same file.

however, doesn't address problem.

in case, should remove standalone normalize.css. if included before semantic ui, largely, if not entirely, overridden semantic ui , own copy of normalize.css. if it's included afterwards, resetting things defined semantic ui, , don't want either.

generally, if framework includes normalize.css, intended used no other frameworks. (i.e. wouldn't use foundation 5 , semantic ui @ same time.)

when concatenate css, include global frameworks first (semantic ui) add other things icon packs, sliders (such slick.js), mobile navigation patterns (slidebars.js), etc.

if using semantic ui , decide foundation (or other framework) has nice feature want use, find frameworks have css , js broken down individual components too. include css file specific feature interested in. in case, there should no duplicate code, although namespace conflicts possible.

also, if you're concerned missing out on v3.0.3 of normalize.css because semantic has v3.0.1 included, imagine there's hardly difference.


Comments

Popular posts from this blog

c++ - No viable overloaded operator for references a map -

java - Custom OutputStreamAppender not run: LOGBACK: No context given for <MYAPPENDER> -

java - Cannot secure connection using TLS -