diff --git a/README.md b/README.md index 653db61..3688099 100644 --- a/README.md +++ b/README.md @@ -4,7 +4,7 @@ ### What it does * [Jade](http://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/) +* [ES6+ JavaScript](babeljs.io) files to ES5 Javascript through [browserify](http://browserify.org/) * You are able to use 'require' in your client-side code * Serves your static files to localhost:9001 * Reloads your browser with LiveReload when files change @@ -18,7 +18,7 @@ npm install npm start open http://localhost:9001 in your browser -```` +``` ## CLI Commands * npm install @@ -28,6 +28,7 @@ * npm run build * Builds everything +# Production build Minification, uglification and other tasks you're expected to run before deploying your product can be made by running the build command with env variable NODE_ENV set to "production" NODE_ENV=production npm run build @@ -37,23 +38,6 @@ 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**. -### Using JavaScript instead of CoffeeScript -Remove coffeeify transform from package.json file (browserify.transform field) -```diff - "transform": [ -- "coffeeify", - "debowerify", - "deamdify" - ] -``` - -and change the ".coffee" extension to ".js" from gulpfile.coffee -```diff -config = - scripts: -- 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. +# FAQ +### I want to use CoffeeScript instead of JavaScript +Check out the [coffee branch](https://github.com/leonidas/gulp-project-template/tree/coffee) diff --git a/gulpfile.js b/gulpfile.js index f670084..67de18f 100644 --- a/gulpfile.js +++ b/gulpfile.js @@ -6,7 +6,7 @@ var duration = require('gulp-duration'); var gulp = require('gulp'); var gutil = require('gulp-util'); var jade = require('gulp-jade'); -var notify = require('gulp-notify'); +var notifier = require('node-notifier'); var prefix = require('gulp-autoprefixer'); var source = require('vinyl-source-stream'); var sourcemaps = require('gulp-sourcemaps'); @@ -19,9 +19,9 @@ var production = process.env.NODE_ENV === 'production'; var config = { scripts: { - source: './src/coffee/main.coffee', - extensions: ['.coffee'], + source: './src/js/main.js', destination: './public/js/', + extensions: ['.jsx'], filename: 'bundle.js' }, templates: { @@ -52,7 +52,7 @@ var browserifyConfig = { function handleError(err) { gutil.log(err); gutil.beep(); - notify({ + notifier.notify({ title: 'Compile Error', message: err.message }); diff --git a/package.json b/package.json index b18059a..ba421de 100644 --- a/package.json +++ b/package.json @@ -15,19 +15,20 @@ "gulp", "template" ], - "dependencies": {}, + "dependencies": { + "lodash": "^3.9.1" + }, "devDependencies": { + "babelify": "^6.1.1", "bower": "~1.3.5", "browser-sync": "^2.7.2", "browserify": "^10.2.1", - "coffeeify": "~0.7.0", "deamdify": "^0.1.1", "debowerify": "~0.9.1", "gulp": "~3.8.1", "gulp-autoprefixer": "1.0.1", "gulp-duration": "0.0.0", "gulp-jade": "~0.9.0", - "gulp-notify": "^2.2.0", "gulp-sourcemaps": "^1.3.0", "gulp-streamify": "0.0.5", "gulp-stylus": "~2.0.0", @@ -36,14 +37,14 @@ "karma": "~0.12.21", "karma-chrome-launcher": "~0.1.4", "karma-cli": "0.0.4", - "karma-coffee-preprocessor": "~0.2.1", "karma-jasmine": "~0.2.2", + "node-notifier": "^4.2.1", "vinyl-source-stream": "~1.0.0", "watchify": "^3.2.1" }, "browserify": { "transform": [ - "coffeeify", + "babelify", "debowerify", "deamdify" ] diff --git a/src/coffee/main.coffee b/src/coffee/main.coffee deleted file mode 100644 index 14d7b64..0000000 --- a/src/coffee/main.coffee +++ /dev/null @@ -1 +0,0 @@ -console.log 'foobar' diff --git a/src/js/main.js b/src/js/main.js new file mode 100644 index 0000000..e679bcc --- /dev/null +++ b/src/js/main.js @@ -0,0 +1,33 @@ +'use strict'; + +import {partialRight, invoke} from 'lodash'; + +Promise.all([ + fetch('https://api.github.com/repos/leonidas/gulp-project-template'), + fetch('https://api.github.com/repos/leonidas/gulp-project-template/commits') +]) +.then(partialRight(invoke, 'json')) +.then(Promise.all.bind(Promise)) +.then(data => { + + const [repository, commits] = data; + const {html_url, description, full_name} = repository; + + const commitItems = commits.map(item => { + const {commit} = item; + + return ` +
  • + ${commit.message.replace(/\n/g, '
    ')} +

    + ${commit.committer.name} +
  • `; + }); + + document.body.innerHTML = ` +

    ${description}

    +

    ${full_name}

    + + `; +}); + diff --git a/src/stylus/style.styl b/src/stylus/style.styl index e09ddc3..a389d9d 100644 --- a/src/stylus/style.styl +++ b/src/stylus/style.styl @@ -1,2 +1,23 @@ body, html margin 0 + padding 1em + font 14px/1.4 'Helvetica Neue', Helvetica, Arial + color #333 + +li + margin 1em 0 + padding 1em 0 + border-bottom 1px solid #eee + +h1 + margin-bottom 0 + +h2 + margin-top 0 + +ul + margin-top 2em + +li + small + color #777