Total Pageviews

Wednesday, 18 July 2018

基于nodejs的静态网站生成器-assemble

Static site generator for Node.js, Grunt.js, and Yeoman (and soon, Gulp), using the Handlebars template engine. Used by Zurb Foundation, Zurb Ink, H5BP/Effeckt, Less.js / lesscss.org, Topcoat, Web Experience Toolkit, and hundreds of other projects to build sites, themes, components, documentation, blogs and gh-pages.

assemble NPM version Build Status

Static site generator for Grunt.js, Yeoman and Node.js. Used by Zurb Foundation, Zurb Ink, H5BP/Effeckt, Less.js / lesscss.org, Topcoat, Web Experience Toolkit, and hundreds of other projects to build sites, themes, components, documentation, blogs and gh-pages.

Visit the website →

Why use Assemble?

  1. Most popular site generator for Grunt.js and Yeoman. Assemble is used to build hundreds of web projects, ranging in size from a single page to 14,000 pages (that we're aware of!). Let us know if you use Assemble.
  2. Allows you to carve your HTML up into reusable fragments: partials, includes, sections, snippets... Whatever you prefer to call them, Assemble does that.
  3. Optionally use layouts to wrap your pages with commonly used elements and content.
  4. "Pages" can either be defined as HTML/templates, JSON or YAML, or directly inside the Gruntfile.
  5. It's awesome. Lol just kidding. But seriously, Assemble... is... awesome! and it's fun to use.
...and of course, we use Assemble to build the project's own documentation http://assemble.io:
For more: hear Jon Schlinkert and Brian Woodward discuss Assemble on Episode 98 of the Javascript Jabber Podcast.
image

The "assemble" task

Getting Started

Assemble requires Grunt ~0.4.1
If you haven't used grunt before, be sure to check out the Getting Started guide.
From the same directory as your project's Gruntfile and package.json, install Assemble with the following command:
npm install assemble --save-dev
Once that's done, add this line to your project's Gruntfile:
grunt.loadNpmTasks('assemble');

The "assemble" task

Run the "assemble" task with the grunt assemble command.
Task targets, files and options may be specified according to the grunt Configuring tasks guide.
In your project's Gruntfile, add a section named assemble to the data object passed into grunt.initConfig().
assemble: {
  options: {
    assets: 'assets',
    plugins: ['permalinks'],
    partials: ['includes/**/*.hbs'],
    layout: ['layouts/default.hbs'],
    data: ['data/*.{json,yml}']
  },
  site: {
    src: ['docs/*.hbs'],
    dest: './'
  }
},

Options

See the documentation for Options for more information.

assets

Type: String Default: undefined
Used with the {{assets}} variable to resolve the relative path from the dest file to the assets folder.

data

Type: String|Array|Object Default: src/data
Specify the data to supply to your templates. Data may be formatted in JSON, YAML, YAML front matter, or passed directly as an object. Wildcard patterns may also be used.

layoutdir

Type: String Default: undefined
The directory to use as the "cwd" for layouts. When this option is defined, layouts may be defined using only the name of the layout.

layout

Type: String Default: undefined
If set, this defines the layout file to use for the task or target. However, when specifying a layout, unlike Jekyll, Assemble requires a file extension since you are not limited to using a single file type.

layoutext

Type: String Default: undefined
Specify the extension to use for layouts, enabling layouts in YAML front matter to be defined without an extension:
---
layout: default
---

partials

Type: String|Array Default: undefined
Specifies the Handlebars partials files, or paths to the directories of files to be used.

plugins

Type: String|Array Default: undefined
Name of the npm module to use and/or the path(s) to any custom plugins to use. Wildcard patterns may also be used.

helpers

Type: String|Array Default: handlebars-helpers
Name of the npm module to use and/or the path(s) to any custom helpers to use with the current template engine. Wildcard patterns may also be used.
By default, Assemble includes handlebars-helpers as a dependency, so any helpers from that library are already available to be used in your templates.

ext

Type: String Default: .html
Specify the file extension for destination files. Example:

marked

Type: Object Default: Marked.js defaults
Specify the Marked.js options for the {{#markdown}}{{/markdown}} and {{md ""}} helpers to use when converting content.

engine

Type: String Default: Handlebars
Specify the engine to use for compiling templates if you are not using Handlebars.
Also see assemble-swig for compiling Swig Templates.

flatten

Type: Boolean Default: false
Remove anything after (and including) the first . in the destination path, then append this value. In other words, when files are generated from different source folders this "flattens" them into the same destination directory. See building the files object dynamically for more information on files formats.
Visit Assemble's documentation for more information about options.

Usage Examples

Simple example of using data files in both .json and .yml format to build Handlebars templates.
assemble: {
  options: {
    data: 'src/data/**/*.{json,yml}'
  },
  docs: {
    files: {
      'dist/': ['src/templates/**/*.hbs']
    }
  }
}

Using multiple targets

assemble: {
  options: {
    assets: 'assets',
    layoutdir: 'docs/layouts'
    partials: ['docs/includes/**/*.hbs'],
    data: ['docs/data/**/*.{json,yml}']
  },
  site: {
    options: {
      layout: 'default.hbs'
    },
    src: ['templates/site/*.hbs'],
    dest: './'
  },
  blog: {
    options: {
      layout: 'blog-layout.hbs'
    },
    src: ['templates/blog/*.hbs'],
    dest: 'articles/'
  },
  docs: {
    options: {
      layout: 'docs-layout.hbs'
    },
    src: ['templates/docs/*.hbs'],
    dest: 'docs/'
  }
},
Visit Assemble's documentation for many more examples and pointers on getting started.

Contributing

In lieu of a formal styleguide, take care to maintain the existing coding style. Add unit tests for any new or changed functionality, and please re-build the documentation with grunt-verb before submitting a pull request.

Assemble plugins

Here are some related projects you might be interested in from the Assemble core team.
Visit assemble.io/assemble-middleware for more information about Assemble middleware.

Authors

Jon Schlinkert
Brian Woodward

This file was generated by grunt-verb on June 13, 2014.

from https://gitlab.com/Acidburn0zzz/assemble
(http://assemble.io/)
----------------------------
 
Get the rocks out of your socks! Assemble makes you fast at web development! Used by thousands of projects for rapid prototyping, themes, scaffolds, boilerplates, e-books,  blogs, static site generator, an alternative to Jekyll for gh-pages and more! Gulp- and grunt-friendly. 

http://assemble.io/

assemble

NPM version NPM monthly downloads Build Status Gitter

Looking for the grunt plugin? Please visit grunt-assemble.

(Note that the current website assemble.io, is for grunt-assemble. Thanks for your patience while we work on updating the site with documentation for the latest assemble).

Overview

(Click the following sections to expand them)

Table of contents
What is Assemble?
Who uses assemble?
Why should I use assemble?
What can I do with Assemble?
Rapid development toolkit
Features

Quickstart

Installing assemble

Add assemble your project's devDependencies using npm:

$ npm install -D assemble

You should now be able to run assemble directly (using node assemblefile.js etc) or using npm scripts. For example, add the following to package.json:

{
  "scripts": {
    "build": "assemble"
  }
}

Then run

$ npm run build

Installing assemble's CLI

You can also assemble's CLI globally, which adds the assemble command to your system path, allowing it to be run from any directory.

$ npm install --global assemble

Note that even if assemble is installed globally, it's good practice to install it locally in every project to ensure that your projects are protected against any potentially breaking changes that might occur in assemble between development cycles.

assemblefile.js

To use assemble's CLI, you'll need to add an assemblefile.js to your project. The fastest way to do this is to run the following command:

$ assemble

If no assemblefile.js exists in the current project, assemble will ask if you want to add one. If you answer yes, assemble will then generate a basic assembfile.js for you.

CLI

Run assemble from the command line.

$ assemble <tasks> [options]

Running tasks

Specify one or more space-separated tasks to run.

Examples

Run task foo

$ assemble foo

Run tasks foo and bar

$ assemble foo bar

Specifying options

Non-task options are prefixed with --.

Examples

Set the --cwd to run an assemblefile.js in a different directory:

$ assemble --cwd=docs

Emit views as they're loaded and log them to stderr:

$ assemble --emit=view

See more [command line options](#command line options)

Object expansion

Object-paths may be specified using dot-notation for either the key or value in a command line argument.

Additionally, assemble uses expand-object (and some custom parsing) to make it easier to pass non-trivial options and commands via command line. So all of the following formats are possible.

Examples

Boolean values:

$ assemble --foo 
# { foo: true }

Key-value pairs:

$ assemble --foo=bar
# { foo: 'bar' }

Nested booleans:

$ assemble --option=foo 
# {options: { foo: true }}

Nested key-value pairs:

$ assemble --option=foo:bar
# {options: { foo: 'bar' }}

Deeply nested key-value pairs:

$ assemble --option=foo.bar.baz:qux
# {options: foo: { bar: { baz: 'qux' }}}}

Or on the left-side of the =:

$ assemble --option.foo.bar.baz=qux
# {options: foo: { bar: { baz: 'qux' }}}}

Command line options

cwd

Change the cwd for the assemblefile.js to run, optionally specifying any tasks to run:

$ assemble <tasks> --cwd [directory]

Example

To run the scaffolds example in the examples/ directory, you would enter:

$ assemble --cwd examples/scaffolds

If successful, in the command line, you should see something like this:

screen shot 2016-01-09 at 1 35 52 pm

file

Specify the name of the config file for assemble's CLI to run, the default is assemblefile.js.

Example

$ assemble --file assemblefile.dev.js
from https://github.com/assemble/assemble
------

Assemble 是一个使用 Node.jsGrunt.jsGulpYeoman 等来实现的静态网页生成系统。已被 Zurb Foundation, Zurb Ink, H5BP/Effeckt, Less.js/lesscss.org, Topcoat, Web Experience Toolkit 等数百个项目用来生成项目网站、主题、组件、文档、博客和 github 页面。

grunt 生态系统下的一个新玩具,前端工程师们可以没事捣鼓捣鼓。 
(Assemble 是一个强大的静态网站生成器(SSG),旨在简化静态网站的创建和管理过程。它是由 Assemble.io 团队开发和维护的,提供了一套丰富的工具和功能,使开发者能够轻松构建、组织和发布静态网站。

需要注意的是,Assemble 是一个相对较早期的静态网站生成器,已经多年没有更新迭代了。

您可以查看它的官网GitHub了解更多。)

 

No comments:

Post a Comment