🔖 v0.1.0-alpha.22

README.md

@@ -53,7 +53,7 @@ $ x-pages deploy --production
  │   │   └── style.scss ······························ entry scss
  │   ├── img ········································· images (auto minify)
  │   │   └── rock.png ································ image file
- │   └── js ·········································· scripts (auto compile es2015)
+ │   └── js ·········································· scripts (auto uglify)
  │   └── global.js ······························· script file
  ├── layouts ········································· layouts (dont output)
  │   └── basic.html ·································· layout file
@@ -90,7 +90,7 @@ module.exports = {
 }
 ```
 
-And all of the properties in the `config.js` can be used as template variables in the template. e.g. `{{@site.title}}` => `config.title`.
+And all of the properties in the `config.js` or `config.json` can be used as template variables in the template. e.g. `{{@site.title}}` => `config.title`.
 
 In other words, you can add any template variables you need into the configuration file.
 

bin/cli.js

@@ -6,44 +6,73 @@ const { name, version } = require('../package')
 
 const { env, argv, cwd } = process
 
-// version
+/**
+ * version command
+ */
+
 if (['-v', '--version'].includes(argv[2])) {
  console.log(colors.red('v' + version))
  process.exit()
 }
 
-// task scope
-if (!['init', 'serve', 'build', 'deploy', 'serve:dist'].includes(argv[2])) {
- console.log(`
-command '${argv[2]}' not found
+/**
+ * help command
+ */
 
-Usage:
+const help = `
+${colors.cyan('Usage:')}
  ${name} <command> [options]
 
-commands:
+${colors.cyan('Commands:')}
  init
  serve
  build
- deploy
  serve:dist
+ deploy
+ clean
 
-options:
- --production
-`)
+${colors.cyan('Options:')}
+ --production, --prod
+`
+
+if (['-h', '--help'].includes(argv[2])) {
+ console.log(help)
  process.exit()
 }
 
-// mode
+/**
+ * command scope
+ */
+const allowCommands = ['init', 'serve', 'build', 'serve:dist', 'deploy', 'clean']
+
+if (!allowCommands.includes(argv[2])) {
+ console.log(`
+Command '${argv[2]}' not found`)
+ console.log(help)
+ process.exit()
+}
+
+/**
+ * env mode
+ */
+
 if (env.NODE_ENV === undefined) {
- env.NODE_ENV = argv.includes('--production') ? 'production' : 'development'
+ env.NODE_ENV = argv.includes('--production') || argv.includes('--prod') ? 'production' : 'development'
 }
 
-// bootstrap gulp
 log('Running', colors.red(argv[2]), 'in', colors.blue(env.NODE_ENV), 'mode')
 
+/**
+ * gulp arguments
+ */
+
 argv.push('--cwd')
 argv.push(cwd())
 argv.push('--gulpfile')
-argv.push(join(__dirname, '../lib/tasks.js'))
+argv.push(join(__dirname, '../lib'))
+
+/**
+ * bootstrap gulp
+ */
 
 require('gulp/bin/gulp')

example/README.md

@@ -12,7 +12,7 @@
  │   │   └── style.scss ······························ entry scss
  │   ├── img ········································· images (auto minify)
  │   │   └── rock.png ································ image file
- │   └── js ·········································· scripts (auto compile es2015)
+ │   └── js ·········································· scripts (auto uglify)
  │   └── global.js ······························· script file
  ├── layouts ········································· layouts (dont output)
  │   └── basic.html ·································· layout file

lib/config.js

@@ -1,6 +1,7 @@
 const path = require('path')
 const tmp = require('tmp')
 const del = require('del')
+const { name } = require('../package')
 
 const cwd = process.cwd()
 
@@ -16,7 +17,7 @@ const defaults = {
 // Try to require project config
 let projectConfig
 try {
- projectConfig = require(path.join(cwd, 'config.js'))
+ projectConfig = require(path.join(cwd, 'config'))
 } catch (e) {
  projectConfig = {}
 }
@@ -31,8 +32,8 @@ for (const key in config) {
 }
 
 // temp dirs
-config.temp = tmp.dirSync({ prefix: 'x-page-', unsafeCleanup: true }).name
-config.deploy = tmp.dirSync({ prefix: 'x-page-', unsafeCleanup: true }).name
+config.temp = tmp.dirSync({ prefix: `${name}-`, unsafeCleanup: true }).name
+config.deploy = tmp.dirSync({ prefix: `${name}-`, unsafeCleanup: true }).name
 
 // clear temp when ctrl+c
 process.on('SIGINT', () => del([config.temp, config.deploy], { force: true }).then(process.exit))

lib/hbs/index.js → lib/hbs.js

@@ -1,5 +1,6 @@
 const fs = require('fs')
 const path = require('path')
+
 const fm = require('front-matter')
 const hbs = require('handlebars')
 const through = require('through2')
@@ -15,30 +16,39 @@ module.exports = config => {
  const site = Object.assign({}, config)
  const page = Object.assign({}, config.defaults)
 
- const compileLayout = (layout, body) => {
+ const renderLayout = (layout, body) => {
  const content = fm(fs.readFileSync(path.join(config.layouts, layout + '.html'), 'utf8'))
+
  Object.assign(page, content.attributes)
+
  const template = hbs.compile(content.body)
+
  let result = template({ body: new hbs.SafeString(body) }, { data: { site, page } })
+
  if (content.attributes.layout) {
- result = compileLayout(content.attributes.layout, result)
+ result = renderLayout(content.attributes.layout, result)
  }
+
  return result
  }
 
  return through.obj((file, encoding, callback) => {
  try {
  const content = fm(file.contents.toString(encoding))
+
  Object.assign(page, content.attributes)
+
  const template = hbs.compile(content.body)
+
  let result = template({}, { data: { site, page } })
 
  // try to find layout
  if (content.attributes.layout) {
- result = compileLayout(content.attributes.layout, result)
+ result = renderLayout(content.attributes.layout, result)
  }
 
  file.contents = Buffer.from(result)
+
  callback(null, file)
  } catch (e) {
  callback(e)

lib/helpers.js

@@ -0,0 +1,51 @@
+const path = require('path')
+const moment = require('moment')
+const hbs = require('handlebars')
+
+const blocks = {}
+
+module.exports = config => {
+ /**
+ * asset helper
+ */
+ hbs.registerHelper('asset', (uri, opts) => {
+ return `${path.basename(config.assets)}/${uri}`
+ })
+
+ /**
+ * url helper
+ * @todo relative url
+ */
+ hbs.registerHelper('url', (uri, opts) => {
+ uri = opts ? uri : '/'
+ return uri.startsWith('/') ? uri.substr(1) : uri
+ })
+
+ /**
+ * equal helper
+ */
+ hbs.registerHelper('equal', (a, b, opts) => {
+ if (!opts) throw new Error('Handlebars Helper `equal` needs 2 parameters')
+ return a === b ? opts.fn(opts.data.root) : opts.inverse(opts.data.root)
+ })
+
+ /**
+ * date helper
+ */
+ hbs.registerHelper('date', (format, opts) => {
+ return moment().format(format)
+ })
+
+ /**
+ * block helper
+ */
+ hbs.registerHelper('block', (key, opts) => {
+ const block = blocks[key] = blocks[key] || []
+ if (opts.fn) {
+ block.push(opts.fn(opts.data.root))
+ } else {
+ delete blocks[key]
+ return new hbs.SafeString(block.join('\n'))
+ }
+ })
+}

lib/tasks.js → lib/index.js

@@ -11,20 +11,17 @@ const hbs = require('./hbs')
 
 /**
  * Config
- * @type {Object}
  */
 const config = require('./config')
 const { cwd, assets, temp, output, debug, remote, branch, deploy } = config
 
 /**
  * Load all plugin for gulp
- * @type {Object}
  */
 const $ = gulpLoadPlugins()
 
 /**
  * BrowserSync Server
- * @type {Object}
  */
 const bs = browserSync.create()
 
@@ -35,11 +32,13 @@ const bs = browserSync.create()
  */
 gulp.task('init', () => {
  const { log, colors } = $.util
+
  if (fs.readdirSync(cwd).length) {
  return log(colors.red(cwd), colors.blue('is not empty'))
  }
 
  const example = path.join(__dirname, '../example')
+
  return gulp.src(path.join(example, '**'), { base: example, dot: true })
  .pipe($.plumber())
  .pipe($.ignore([
@@ -58,10 +57,10 @@ gulp.task('styles', () => {
  .pipe($.if(debug, $.sourcemaps.init()))
  .pipe($.sass.sync({ outputStyle: 'expanded' }))
  // https://github.com/gulp-sourcemaps/gulp-sourcemaps/issues/60
- .pipe($.if(!debug, $.autoprefixer({ browsers: ['> 1%', 'last 2 versions', 'Firefox ESR'] })))
+ .pipe($.if(!debug, $.autoprefixer({ browsers: ['last 2 versions'] })))
  .pipe($.if(!debug, $.cssnano()))
- .pipe($.if(debug, $.sourcemaps.write()))
- .pipe($.rename(p => { p.dirname = p.dirname.replace('scss', 'css') }))
+ .pipe($.if(debug, $.sourcemaps.write('.')))
+ .pipe($.rename(p => { p.dirname = p.dirname.replace('scss', 'css').replace('sass', 'css') }))
  .pipe(gulp.dest(temp))
  .pipe(bs.reload({ stream: true }))
 })
@@ -73,7 +72,7 @@ gulp.task('scripts', () => {
  return gulp.src(path.join(assets, '**/*.js'), { base: cwd })
  .pipe($.plumber())
  .pipe($.if(debug, $.sourcemaps.init()))
- .pipe($.babel({ presets: [require('babel-preset-es2015')] }))
+ // .pipe($.babel({ presets: [require('babel-preset-es2015')] }))
  .pipe($.if(!debug, $.uglify()))
  .pipe($.if(debug, $.sourcemaps.write('.')))
  .pipe(gulp.dest(temp))

package.json

@@ -1,14 +1,14 @@
 {
  "name": "x-pages",
- "version": "0.1.0-alpha.21",
+ "version": "0.1.0-alpha.22",
  "description": "A simple static x-pages develop workflow",
  "homepage": "https://github.com/zce/x-pages#readme",
  "bugs": {
  "url": "https://github.com/zce/x-pages/issues"
  },
  "license": "MIT",
  "author": "zce <w@zce.me> (https://zce.me)",
- "main": "lib/tasks.js",
+ "main": "lib",
  "bin": {
  "x-pages": "bin/cli.js"
  },
@@ -25,7 +25,7 @@
  "dependencies": {
  "babel-core": "^6.26.0",
  "babel-preset-es2015": "^6.24.1",
- "browser-sync": "^2.18.13",
+ "browser-sync": "^2.19.0",
  "bs-html-injector": "^3.0.3",
  "del": "^3.0.0",
  "front-matter": "^2.3.0",
@@ -47,7 +47,7 @@
  "gulp-util": "^3.0.8",
  "gulp-watch": "^4.3.11",
  "handlebars": "^4.0.11",
- "moment": "^2.19.4",
+ "moment": "^2.20.1",
  "react-static": "^4.5.0",
  "run-sequence": "^2.2.0",
  "tmp": "^0.0.33",