I am trying to set up a Grunt project with bower dependencies with two tasks: development and deploy. The project folder structure currently looks like this:
. ├── bower_components │ ├── animate.css │ ├── jquery │ ├── semantic-ui │ └── wow ├── dist │ └── assets │ ├── styles │ └── js ├── node_modules └── src └── assets ├── less └── js
I am currently using grunt-wiredep to automagically include the bower dependencies in the HTML files in
dist. I am trying to keep the
bower_components out of the
dist folder to keep a separation of development and deploy (even though during development the site is served from
As I am new to this I am having a complete imagination failure in working out the right grunt/bower modules and best practice for developing and deploying (yes Yeoman takes care of a lot of this, but I am trying to learn). My current vision is:
My question is: what is the (or a) good way to use bower components in development and deploy targets with minimal grunt-contrib-copy/grunt-contrib-concat/grunt-string-replace or such modules to move files around and rewrite HTML references? Or will this step always have a high manual element to it - which seems odd to me given bower and grunt go together like KFC chips and 'potato and gravy'.
JS and LESS/CSS concatenation is easy with each types respective uglify and minify grunt modules. Bower files are excluded from these processes and wiredep and wiredepCopy don't appear to provide a simple way to "clean up" (minify/concatenate and update the respective links in HTML files) for the deploy task. wiredepCopy doesn't even update references in the HTML during the development task to the moved files which seems odd to me (and begging for a Pull Request). Maybe wiredep is not the way forward? Thanks!