diff --git a/README.md b/README.md index 41dbe73..d8ac91c 100644 --- a/README.md +++ b/README.md @@ -19,6 +19,9 @@ npm start open http://localhost:9001 in your browser ```` +### Enable LiveReload +Install [LiveReload for Chrome](https://chrome.google.com/webstore/detail/livereload/jnihajbhpnppcggbcgedagnkighmdlei?hl=en) + ## CLI Commands * npm install * Installs server-side dependencies from NPM and client-side dependencies from Bower @@ -36,45 +39,23 @@ Minification, uglification and other tasks you're expected to run before deployi It should be possible to delete directory completely and after **npm start** or **npm run build** everything should be as they were before the deletion. * All backend dependencies should be installed with **npm**. Browser dependencies should be installed with **bower** or with **npm**. -### 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 your should be able to require jQuery in your coffee files - - $ = require 'jquery' - -If this does not work, you may need to add the pakcage manually and shim it, like - - ... - - "browser": { - "tunkki": "./bower_components/tunkki/dist/tunkki.js" - }, - "browserify-shim": { - "tunkki": "tunkki" - } - ... - -Read more about it [here](https://github.com/thlorenz/browserify-shim). - ### Using JavaScript instead of CoffeeScript Remove coffeeify transform from package.json file (browserify.transform field) -`````` -"browserify": { - "transform": ["browserify-shim"] -} -`````` +```diff + "transform": [ +- "coffeeify", + "debowerify", + "deamdify" + ] +``` and change the ".coffee" extension to ".js" from gulpfile.coffee -`````` -paths = +```diff +config = scripts: - source: './src/coffee/main.js' -````` - +- source: './src/coffee/main.coffee' +- extensions: ['.coffee'] ++ source: './src/js/main.js' ++ extensions: ['.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) diff --git a/gulpfile.coffee b/gulpfile.coffee index 4bf4d74..9c18108 100644 --- a/gulpfile.coffee +++ b/gulpfile.coffee @@ -17,9 +17,10 @@ watchify = require 'watchify' production = process.env.NODE_ENV is 'production' -paths = +config = scripts: source: './src/coffee/main.coffee' + extensions: ['.coffee'] destination: './public/js/' filename: 'bundle.js' templates: @@ -43,25 +44,25 @@ handleError = (err) -> gulp.task 'scripts', -> bundle = browserify - entries: [paths.scripts.source] - extensions: ['.coffee'] + entries: [config.scripts.source] + extensions: config.scripts.extensions debug: not production build = bundle.bundle() .on 'error', handleError - .pipe source paths.scripts.filename + .pipe source config.scripts.filename build.pipe(streamify(uglify())) if production build - .pipe gulp.dest paths.scripts.destination + .pipe gulp.dest config.scripts.destination gulp.task 'templates', -> pipeline = gulp - .src paths.templates.source + .src config.templates.source .pipe(jade(pretty: not production)) .on 'error', handleError - .pipe gulp.dest paths.templates.destination + .pipe gulp.dest config.templates.destination pipeline = pipeline.pipe livereload(auto: false) unless production @@ -69,7 +70,7 @@ gulp.task 'templates', -> gulp.task 'styles', -> styles = gulp - .src paths.styles.source + .src config.styles.source .pipe stylus 'include css': true @@ -77,14 +78,14 @@ gulp.task 'styles', -> .pipe prefix 'last 2 versions', 'Chrome 34', 'Firefox 28', 'iOS 7' styles = styles.pipe(CSSmin()) if production - styles = styles.pipe gulp.dest paths.styles.destination + styles = styles.pipe gulp.dest config.styles.destination styles = styles.pipe livereload(auto: false) unless production styles gulp.task 'assets', -> gulp - .src paths.assets.source - .pipe gulp.dest paths.assets.destination + .src config.assets.source + .pipe gulp.dest config.assets.destination gulp.task 'server', -> require('http') @@ -94,13 +95,13 @@ gulp.task 'server', -> gulp.task 'watch', -> livereload.listen() - gulp.watch paths.templates.watch, ['templates'] - gulp.watch paths.styles.watch, ['styles'] - gulp.watch paths.assets.watch, ['assets'] + gulp.watch config.templates.watch, ['templates'] + gulp.watch config.styles.watch, ['styles'] + gulp.watch config.assets.watch, ['assets'] bundle = watchify browserify - entries: [paths.scripts.source] - extensions: ['.coffee'] + entries: [config.scripts.source] + extensions: config.scripts.extensions debug: not production cache: {} packageCache: {} @@ -112,10 +113,10 @@ gulp.task 'watch', -> build = bundle.bundle() .on 'error', handleError - .pipe source paths.scripts.filename + .pipe source config.scripts.filename build - .pipe gulp.dest paths.scripts.destination + .pipe gulp.dest config.scripts.destination .pipe(livereload()) gutil.log "Finished '#{chalk.cyan 'rebundle'}' after #{chalk.magenta prettyTime process.hrtime start}" diff --git a/package.json b/package.json index 84e6e33..88bffea 100644 --- a/package.json +++ b/package.json @@ -21,7 +21,6 @@ "devDependencies": { "bower": "~1.3.5", "browserify": "~6.1.0", - "browserify-shim": "~3.8.0", "chalk": "~0.5.1", "coffeeify": "~0.7.0", "deamdify": "^0.1.1", @@ -45,14 +44,11 @@ "vinyl-source-stream": "~1.0.0", "watchify": "~2.0.0" }, - "browser": {}, - "browserify-shim": {}, "browserify": { "transform": [ "coffeeify", "debowerify", - "deamdify", - "browserify-shim" + "deamdify" ] } }