diff --git a/README.md b/README.md index 90b25cb..cc419fd 100644 --- a/README.md +++ b/README.md @@ -43,7 +43,7 @@ Minification, uglification and other tasks you're expected to run before deployi #### Dependencies All dependencies are meant to be installed with **npm**. * JavaScript-files from **node_modules** can be *require()*'d in client-side modules. -* CSS files can be [imported](https://learnboost.github.io/stylus/docs/import.html) from **node_modules** using relative path from the stylus file to the css file e.g `@import '../../node_modules/bootstrap/dist/css/bootstrap.css'` +* Third party CSS files should be [imported](https://learnboost.github.io/stylus/docs/import.html). Stylus has been configured to use **node_modules** as one of the base directories so you can import file like this: `@import 'bootstrap/dist/css/bootstrap.css'` * You can either create a new gulp task for copying other assets from directories mentioned above or use an array as a value for [assets sources](https://github.com/leonidas/gulp-project-template/blob/master/gulpfile.js#L38) e.g `source: ['./src/assets/**/*.*', 'node_modules/bootstrap/fonts*/*.*']` *(notice the asterisk after 'fonts'? It makes gulp copy the whole directory instead of just the files inside of it)* ## Suggested development tools diff --git a/gulpfile.js b/gulpfile.js index f5de596..76bbb17 100644 --- a/gulpfile.js +++ b/gulpfile.js @@ -25,6 +25,7 @@ var watch = require('gulp-watch'); var production = process.env.NODE_ENV === 'production'; var config = { + source: './src', destination: './public', scripts: { source: './src/main.js', @@ -112,6 +113,7 @@ gulp.task('styles', function() { pipeline = pipeline.pipe(stylus({ 'include css': true, + paths: ['node_modules', path.join(__dirname, config.source)], compress: production })) .on('error', handleError) diff --git a/src/style.styl b/src/style.styl index 32ba096..3226077 100644 --- a/src/style.styl +++ b/src/style.styl @@ -4,4 +4,5 @@ body, html font 14px/1.4 'Helvetica Neue', Helvetica, Arial color #333 -@import './components/repository' +@import 'components/repository' +// @import 'bootstrap/dist/css/bootstrap.css'