mirror of
https://github.com/koodiklinikka/koodiklinikka.fi.git
synced 2026-02-11 10:51:48 +00:00
Merge branch 'master' of github.com:leonidas/gulp-project-template
Conflicts: package.json
This commit is contained in:
3
.gitignore
vendored
3
.gitignore
vendored
@@ -1,3 +1,4 @@
|
||||
node_modules
|
||||
bower_components
|
||||
public
|
||||
vendor
|
||||
.DS_Store
|
||||
|
||||
42
README.md
42
README.md
@@ -1,6 +1,7 @@
|
||||
# Project template for [gulp.js](http://gulpjs.com/)
|
||||
<img width="114px" height="257px" align="right" src="https://raw.githubusercontent.com/gulpjs/artwork/master/gulp-2x.png"/>
|
||||
|
||||
## What it does
|
||||
### What it does
|
||||
* [Jade](jade-lang.com) files to HTML
|
||||
* [Stylus](http://learnboost.github.io/stylus) files to CSS
|
||||
* [CoffeeScript](http://coffeescript.org/) files to Javascript through [browserify](http://browserify.org/)
|
||||
@@ -18,7 +19,7 @@
|
||||
npm start
|
||||
open http://localhost:9001 in your browser
|
||||
````
|
||||
## Commands
|
||||
## CLI Commands
|
||||
* npm install
|
||||
* Installs server-side dependencies from NPM and client-side dependencies from Bower
|
||||
* npm start
|
||||
@@ -30,22 +31,24 @@ Minification, uglification and other tasks you're expected to run before deployi
|
||||
|
||||
NODE_ENV=production npm run build
|
||||
|
||||
## Development guidelines
|
||||
* **public** - directory should be dedicated only to compiled/copied files from **src** - directory.
|
||||
It should be possible to delete directory completely and after **npm start** or **npm run build** everything should be as they were before the deletation.
|
||||
* All backend dependencies should be installed with **npm**. Browser dependencies should be installed with **bower** or with **npm**.
|
||||
|
||||
## Adding 3rd party libraries
|
||||
### Adding 3rd party libraries
|
||||
**Note**: If the package you are looking for can be found in NPM it's much easier to install it from there. After installing packages from NPM they can be required without any of the following instructions.
|
||||
|
||||
bower install jquery --save
|
||||
|
||||
Now to use jQuery in your frontend code, you'll need to add jQuery to "browser" and "browserify-shim" sections of your package.json. Your package.json should be something like this:
|
||||
Now to use jQuery in your frontend code, you'll need to add jQuery to "browser" section of your package.json. Your package.json should be something like this:
|
||||
|
||||
...
|
||||
|
||||
"browser": {
|
||||
"jquery": "./vendor/jquery/dist/jquery.js"
|
||||
},
|
||||
"browserify-shim": {
|
||||
"jquery": "$"
|
||||
"jquery": "./bower_components/jquery/dist/jquery.js"
|
||||
},
|
||||
"browserify-shim": {},
|
||||
"browserify": {
|
||||
"transform": [ "coffeeify", "browserify-shim" ]
|
||||
}
|
||||
@@ -55,11 +58,24 @@ Now your should be able to require jQuery in your coffee files
|
||||
|
||||
$ = require 'jquery'
|
||||
|
||||
For non-CommonJS compatible modules you have to use browserify-shim. Read more about it [here](https://github.com/thlorenz/browserify-shim).
|
||||
|
||||
## Development guidelines
|
||||
* **public** - directory should be dedicated only to compiled/copied files from **src** - directory.
|
||||
It should be possible to delete directory completely and after **npm start** or **npm run build** everything should be as they were before the deletation.
|
||||
* All backend dependencies should be installed with **npm**. Browser dependencies should be installed with **bower**.
|
||||
### Using JavaScript instead of CoffeeScript
|
||||
Remove coffeeify transform from package.json file (browserify.transform field)
|
||||
``````
|
||||
"browserify": {
|
||||
"transform": ["browserify-shim"]
|
||||
}
|
||||
``````
|
||||
|
||||
## Enable LiveReload
|
||||
and change the ".coffee" extension to ".js" from gulpfile.coffee
|
||||
``````
|
||||
paths =
|
||||
scripts:
|
||||
source: './src/coffee/main.js'
|
||||
`````
|
||||
|
||||
You also can change the directory name to scripts or what ever.
|
||||
|
||||
### Enable LiveReload
|
||||
Install [LiveReload for Chrome](https://chrome.google.com/webstore/detail/livereload/jnihajbhpnppcggbcgedagnkighmdlei?hl=en)
|
||||
|
||||
111
gulpfile.coffee
111
gulpfile.coffee
@@ -11,72 +11,103 @@ streamify = require 'gulp-streamify'
|
||||
rename = require 'gulp-rename'
|
||||
uglify = require 'gulp-uglify'
|
||||
coffeeify = require 'coffeeify'
|
||||
nodeStatic = require 'node-static'
|
||||
lr = require 'tiny-lr'
|
||||
ecstatic = require 'ecstatic'
|
||||
livereload = require 'gulp-livereload'
|
||||
plumber = require 'gulp-plumber'
|
||||
prefix = require 'gulp-autoprefixer'
|
||||
reloadServer = lr()
|
||||
|
||||
production = process.env.NODE_ENV is 'production'
|
||||
|
||||
gulp.task 'coffee', ->
|
||||
paths =
|
||||
scripts:
|
||||
source: './src/coffee/main.coffee'
|
||||
destination: './public/js/'
|
||||
filename: 'bundle.js'
|
||||
templates:
|
||||
source: './src/jade/*.jade'
|
||||
watch: './src/jade/*.jade'
|
||||
destination: './public/'
|
||||
styles:
|
||||
source: './src/stylus/style.styl'
|
||||
watch: './src/stylus/*.styl'
|
||||
destination: './public/css/'
|
||||
assets:
|
||||
source: './src/assets/**/*.*'
|
||||
watch: './src/assets/**/*.*'
|
||||
destination: './public/'
|
||||
|
||||
bundle = watchify('./src/coffee/main.coffee')
|
||||
handleError = (err) ->
|
||||
gutil.log err
|
||||
gutil.beep()
|
||||
this.emit 'end'
|
||||
|
||||
rebundle = ->
|
||||
gulp.task 'scripts', ->
|
||||
|
||||
build = bundle.bundle(debug: not production)
|
||||
.pipe(source('bundle.js'))
|
||||
bundle = browserify
|
||||
entries: [paths.scripts.source]
|
||||
extensions: ['.coffee']
|
||||
|
||||
build.pipe(streamify(uglify())) if production
|
||||
build = bundle.bundle(debug: not production)
|
||||
.on 'error', handleError
|
||||
.pipe source paths.scripts.filename
|
||||
|
||||
build
|
||||
.pipe(gulp.dest('./public/js/'))
|
||||
.pipe(livereload(reloadServer))
|
||||
build.pipe(streamify(uglify())) if production
|
||||
|
||||
bundle.on 'update', rebundle unless production
|
||||
build
|
||||
.pipe gulp.dest paths.scripts.destination
|
||||
|
||||
rebundle()
|
||||
|
||||
gulp.task 'jade', ->
|
||||
gulp.task 'templates', ->
|
||||
gulp
|
||||
.src('src/jade/*.jade')
|
||||
.src paths.templates.source
|
||||
.pipe(jade(pretty: not production))
|
||||
.pipe(gulp.dest('public/'))
|
||||
.pipe livereload(reloadServer)
|
||||
.on 'error', handleError
|
||||
.pipe gulp.dest paths.templates.destination
|
||||
.pipe livereload()
|
||||
|
||||
gulp.task 'stylus', ->
|
||||
gulp.task 'styles', ->
|
||||
styles = gulp
|
||||
.src('src/stylus/style.styl')
|
||||
.src paths.styles.source
|
||||
.pipe(stylus({set: ['include css']}))
|
||||
.pipe(prefix("last 1 version", "> 1%", "ie 8"))
|
||||
.on 'error', handleError
|
||||
.pipe prefix 'last 2 versions', 'Chrome 34', 'Firefox 28', 'iOS 7'
|
||||
|
||||
styles.pipe(CSSmin()) if production
|
||||
styles = styles.pipe(CSSmin()) if production
|
||||
|
||||
styles.pipe(gulp.dest('public/css/'))
|
||||
.pipe livereload reloadServer
|
||||
styles.pipe gulp.dest paths.styles.destination
|
||||
.pipe livereload()
|
||||
|
||||
gulp.task 'assets', ->
|
||||
gulp
|
||||
.src('src/assets/**/*.*')
|
||||
.pipe gulp.dest 'public/'
|
||||
.src paths.assets.source
|
||||
.pipe gulp.dest paths.assets.destination
|
||||
|
||||
gulp.task "server", ->
|
||||
staticFiles = new nodeStatic.Server './public'
|
||||
require('http').createServer (req, res) ->
|
||||
req.addListener 'end', ->
|
||||
staticFiles.serve req, res
|
||||
req.resume()
|
||||
.listen 9001
|
||||
gulp.task 'server', ->
|
||||
require('http')
|
||||
.createServer ecstatic root: __dirname + '/public'
|
||||
.listen 9001
|
||||
|
||||
gulp.task "watch", ->
|
||||
reloadServer.listen 35729, (err) ->
|
||||
console.error err if err?
|
||||
livereload.listen()
|
||||
|
||||
gulp.watch "src/jade/*.jade", ["jade"]
|
||||
gulp.watch "src/stylus/*.styl", ["stylus"]
|
||||
gulp.watch "src/assets/**/*.*", ["assets"]
|
||||
gulp.watch paths.templates.watch, ['templates']
|
||||
gulp.watch paths.styles.watch, ['styles']
|
||||
gulp.watch paths.assets.watch, ['assets']
|
||||
|
||||
gulp.task "build", ["coffee", "jade", "stylus", "assets"]
|
||||
bundle = watchify
|
||||
entries: [paths.scripts.source]
|
||||
extensions: ['.coffee']
|
||||
|
||||
bundle.on 'update', ->
|
||||
build = bundle.bundle(debug: not production)
|
||||
.on 'error', handleError
|
||||
|
||||
.pipe source paths.scripts.filename
|
||||
|
||||
build
|
||||
.pipe gulp.dest paths.scripts.destination
|
||||
.pipe(livereload())
|
||||
|
||||
.emit 'update'
|
||||
|
||||
gulp.task "build", ['scripts', 'templates', 'styles', 'assets']
|
||||
gulp.task "default", ["build", "watch", "server"]
|
||||
|
||||
@@ -1,2 +0,0 @@
|
||||
require('coffee-script/register');
|
||||
require('./gulpfile.coffee');
|
||||
31
package.json
31
package.json
@@ -18,29 +18,28 @@
|
||||
"coffee-script": "~1.7.1"
|
||||
},
|
||||
"devDependencies": {
|
||||
"gulp-rename": "~0.2.1",
|
||||
"gulp-rename": "~1.2.0",
|
||||
"gulp-uglify": "~0.1.0",
|
||||
"gulp-util": "~2.2.9",
|
||||
"gulp-stylus": "0.0.9",
|
||||
"gulp-jade": "~0.3.0",
|
||||
"node-static": "~0.7.3",
|
||||
"gulp-minify-css": "~0.2.0",
|
||||
"tiny-lr": "0.0.5",
|
||||
"gulp-livereload": "~0.2.0",
|
||||
"bower": "~1.2.8",
|
||||
"browserify-shim": "~3.3.1",
|
||||
"gulp-plumber": "~0.5.6",
|
||||
"gulp-autoprefixer": "0.0.6",
|
||||
"browserify": "~3.33.0",
|
||||
"gulp-util": "~2.2.17",
|
||||
"gulp-stylus": "1.0.2",
|
||||
"gulp-jade": "~0.6.0",
|
||||
"gulp-livereload": "~2.1.0",
|
||||
"bower": "~1.3.5",
|
||||
"browserify-shim": "~3.6.0",
|
||||
"gulp-plumber": "~0.6.3",
|
||||
"gulp-autoprefixer": "0.0.7",
|
||||
"browserify": "~4.1.11",
|
||||
"gulp-streamify": "0.0.5",
|
||||
"vinyl-source-stream": "~0.1.1",
|
||||
"coffeeify": "~0.6.0",
|
||||
"gulp": "~3.6.0",
|
||||
"watchify": "~0.6.3",
|
||||
"karma": "~0.12.21",
|
||||
"karma-jasmine": "~0.1.5",
|
||||
"karma-chrome-launcher": "~0.1.4",
|
||||
"karma-coffee-preprocessor": "~0.2.1"
|
||||
"karma-coffee-preprocessor": "~0.2.1",
|
||||
"gulp": "~3.8.1",
|
||||
"watchify": "~0.10.2",
|
||||
"ecstatic": "~0.5.3",
|
||||
"gulp-minify-css": "~0.3.5"
|
||||
},
|
||||
"browser": {},
|
||||
"browserify-shim": {},
|
||||
|
||||
Reference in New Issue
Block a user