search

dstroot / skeleton

Node Express MongoDB Bootstrap Passport... all rolled up into juicy goodness
skeleton-app.jit.su
MIT License
369 stars 47 forks source link

How to add css and js dependencies correctly in Skeletons architecture? #14

Closed cmpsoares91 closed 10 years ago

cmpsoares91 commented 10 years ago

I think the title says it all, I'm trying to add Tablesaw's dependencies to the build but can't figure out where to add it? :-S

dstroot commented 10 years ago

Tricky because Bootstrap also has table "stuff". First I would try to get Bootstrap out of the way.

Edit less / bootstrap.less:

// Core CSS
@import "../public/lib/bootstrap/less/scaffolding.less";
@import "../public/lib/bootstrap/less/type.less";
// @import "../public/lib/bootstrap/less/code.less";
@import "../public/lib/bootstrap/less/grid.less";
@import "../public/lib/bootstrap/less/tables.less";      *<-- Comment this first!
@import "../public/lib/bootstrap/less/forms.less";
@import "../public/lib/bootstrap/less/buttons.less";

Then in main.less I'd import the tablesaw .css if needed on every page (like I am doing with animate.css), or just include in the pages you need via the jade template

@import (less) "../public/lib/animate.css/animate.css";

or

extends ../layouts/layout

block head
  title #{application} &middot; Contact Us

  //- Tablesaw Styles
  link(rel='stylesheet', href='/pathto.tablesaw.css')

block content
  .container

Then in the gulp build process I'd pull in the tablesaw .js, - this way it is the .js that is loaded on every page. If you just need it on specifc pages I'd just include it in the jade template under Block Scripts

cmpsoares91 commented 10 years ago

This one got fixed with issue https://github.com/dstroot/skeleton/issues/16