diff --git a/README.md b/README.md index 97ff3d4..c39d3e6 100644 --- a/README.md +++ b/README.md @@ -1,27 +1,61 @@ +![Pattern Lab Logo](/patternlab.png "Pattern Lab Logo") + +![current release](https://img.shields.io/github/release/pattern-lab/edition-node.svg) ![license](https://img.shields.io/github/license/pattern-lab/edition-node.svg)[![Join the chat at Gitter](https://badges.gitter.im/pattern-lab/node.svg)](https://gitter.im/pattern-lab/node) + # Pattern Lab Node The pure wrapper around [Pattern Lab Node Core](https://github.com/pattern-lab/patternlab-node), the default pattern engine, and supporting frontend assets. +[Online Demo of Pattern Lab Output](http://demo.patternlab.io/) + ## Packaged Components -The Gulp Edition comes with the following components: +This Edition comes with the following components: -* `patternlab-node`: [GitHub](https://github.com/pattern-lab/patternlab-node), [npm](https://www.npmjs.com/package/patternlab-node) -* `patternengine-node-mustache`: [GitHub](https://github.com/pattern-lab/patternengine-node-mustache), [npm](https://www.npmjs.com/package/patternengine-node-mustache) -* `pattern-lab/styleguidekit-assets-default`: [GitHub](https://github.com/pattern-lab/styleguidekit-assets-default) -* `pattern-lab/styleguidekit-mustache-default`: [GitHub](https://github.com/pattern-lab/styleguidekit-mustache-default) +* `pattern-lab/patternlab-node`: [GitHub](https://github.com/pattern-lab/patternlab-node) | [npm](https://www.npmjs.com/package/@pattern-lab/patternlab-node) +* `pattern-lab/patternengine-node-mustache`: [GitHub](https://github.com/pattern-lab/patternengine-node-mustache) | [npm](https://www.npmjs.com/package/@pattern-lab/patternengine-node-mustache) +* `pattern-lab/styleguidekit-assets-default`: [GitHub](https://github.com/pattern-lab/styleguidekit-assets-default) | [npm](https://www.npmjs.com/package/@pattern-lab/styleguidekit-assets-default) +* `pattern-lab/styleguidekit-mustache-default`: [GitHub](https://github.com/pattern-lab/styleguidekit-mustache-default) | [npm](https://www.npmjs.com/package/@pattern-lab/styleguidekit-mustache-default) ## Prerequisites -The Pattern Lab Node uses [Node](https://nodejs.org) for core processing, [npm](https://www.npmjs.com/) to manage project dependencies, and [gulp.js](http://gulpjs.com/) to run tasks and interface with the core library. Node version 4 or higher suffices. You can follow the directions for [installing Node](https://nodejs.org/en/download/) on the Node website if you haven't done so already. Installation of Node will include npm. +The Pattern Lab Node uses [Node](https://nodejs.org) for core processing and [npm](https://www.npmjs.com/) to manage project dependencies. You can follow the directions for [installing Node](https://nodejs.org/en/download/) on the Node website if you haven't done so already. Installation of Node will include npm. ## Installing -Forthcoming +Pattern Lab Node can be used different ways. Editions lilke this one are **example** pairings of Pattern Lab code and do not always have an upgrade path or simple means to run as a dependency within a larger project. Users wishing to be most current and have the greatest flexibility are encouraged to consume `patternlab-node` directly. Users wanting to learn more about Pattern Lab and have a tailored default experience are encouraged to start with an Edition. Both methods still expect to interact with other elements of the [Pattern Lab Ecosystem](https://github.com/pattern-lab/patternlab-node#ecosystem). + +As an edition, the simplist installation sequence is to clone this repository. + +``` bash +mkdir newApp && cs newApp +git clone https://github.com/pattern-lab/edition-node.git +npm install +``` ## Getting Started -Forthcoming +This edition comes pre-packaged with a couple simple scripts. Extend them as needed. + +**build** patterns, copy assets, and construct ui + +``` bash +npm run build +``` + +build patterns, copy assets, and construct ui, watch source files, and **serve** locally + +``` bash +npm run serve +``` + +logs Pattern Lab Node usage and **help** content + +``` bash +npm run help +``` + +To interact further with Pattern Lab Node, such as to install plugins or starterkits, it's suggested to incorporate the [Pattern Lab Node Command Line Interface](https://github.com/pattern-lab/patternlab-node-cli) or learn more about the [core API](https://github.com/pattern-lab/patternlab-node#usage). ## Updating Pattern Lab diff --git a/package.json b/package.json index abf0f82..9050ed8 100644 --- a/package.json +++ b/package.json @@ -1,12 +1,12 @@ { "name": "edition-node", "description": "A pure wrapper around patternlab-node core, the default pattern engine, and supporting frontend assets.", - "version": "0.0.1", + "version": "1.0.0-alpha.1", "dependencies": { - "patternlab-node": "^2.0.0", - "patternengine-node-mustache": "^1.0.0", - "styleguidekit-assets-default": "^3.0.0", - "styleguidekit-mustache-default": "^3.0.0" + "@pattern-lab/patternengine-node-mustache": "^2.0.0-alpha.1", + "@pattern-lab/patternlab-node": "^3.0.0-alpha.5", + "@pattern-lab/styleguidekit-assets-default": "^4.0.0-alpha.2", + "@pattern-lab/styleguidekit-mustache-default": "^4.0.0-alpha.1" }, "keywords": [ "Pattern Lab", @@ -21,10 +21,12 @@ "bugs": "https://github.com/pattern-lab/edition-node/issues", "author": "Brian Muenzenmeyer", "scripts": { - "postinstall": "node scripts/postinstall.js" + "build": "node ./scripts/build.js", + "help": "node ./scripts/help.js", + "serve": "node ./scripts/serve.js" }, "license": "MIT", "engines": { - "node": ">=4.0" + "node": ">=6.0" } } diff --git a/patternlab-config.json b/patternlab-config.json index 55f0c8f..7c37b30 100644 --- a/patternlab-config.json +++ b/patternlab-config.json @@ -1,4 +1,36 @@ { + "cacheBust": true, + "cleanPublic" : true, + "defaultPattern": "all", + "defaultShowPatternInfo": false, + "ishControlsHide": { + "s": false, + "m": false, + "l": false, + "full": false, + "random": false, + "disco": false, + "hay": true, + "mqs": false, + "find": false, + "views-all": false, + "views-annotations": false, + "views-code": false, + "views-new": false, + "tools-all": false, + "tools-docs": false + }, + "ishViewportRange": { + "s": [240, 500], + "m": [500, 800], + "l": [800, 2600] + }, + "logLevel": "info", + "outputFileSuffixes": { + "rendered": ".rendered", + "rawTemplate": "", + "markupOnly": ".markup-only" + }, "paths" : { "source" : { "root": "./source/", @@ -6,8 +38,14 @@ "data" : "./source/_data/", "meta": "./source/_meta/", "annotations" : "./source/_annotations/", - "styleguide" : "./node_modules/styleguidekit-assets-default/dist/", - "patternlabFiles" : "./node_modules/styleguidekit-mustache-default/views/", + "styleguide" : "./node_modules/@pattern-lab/styleguidekit-assets-default/dist/", + "patternlabFiles" : { + "general-header": "./node_modules/@pattern-lab/styleguidekit-mustache-default/views/partials/general-header.mustache", + "general-footer": "./node_modules/@pattern-lab/styleguidekit-mustache-default/views/partials/general-footer.mustache", + "patternSection": "./node_modules/@pattern-lab/styleguidekit-mustache-default/views/partials/patternSection.mustache", + "patternSectionSubtype": "./node_modules/@pattern-lab/styleguidekit-mustache-default/views/partials/patternSectionSubtype.mustache", + "viewall": "./node_modules/@pattern-lab/styleguidekit-mustache-default/views/viewall.mustache" + }, "js" : "./source/js", "images" : "./source/images", "fonts" : "./source/fonts", @@ -25,45 +63,19 @@ "css" : "./public/css" } }, - "styleGuideExcludes": [ - ], - "defaultPattern": "all", - "defaultShowPatternInfo": false, - "cleanPublic" : true, "patternExtension": "mustache", - "ignored-extensions" : ["scss", "DS_Store", "less"], - "ignored-directories" : ["scss"], - "debug": false, - "ishControlsHide": { - "s": false, - "m": false, - "l": false, - "full": false, - "random": false, - "disco": false, - "hay": true, - "mqs": false, - "find": false, - "views-all": false, - "views-annotations": false, - "views-code": false, - "views-new": false, - "tools-all": false, - "tools-docs": false - }, - "ishMinimum": "240", - "ishMaximum": "2600", "patternStateCascade": ["inprogress", "inreview", "complete"], - "patternStates": { - }, - "patternExportPatternPartials": [], "patternExportDirectory": "./pattern_exports/", - "cacheBust": true, - "starterkitSubDir": "dist", - "outputFileSuffixes": { - "rendered": ".rendered", - "rawTemplate": "", - "markupOnly": ".markup-only" + "patternExportPatternPartials": [], + "serverOptions": { + "wait": 1000 }, - "cleanOutputHtml": true + "starterkitSubDir": "dist", + "styleGuideExcludes": [ + ], + "theme": { + "color": "dark", + "density": "compact", + "layout": "horizontal" + } } diff --git a/patternlab.png b/patternlab.png new file mode 100644 index 0000000..80edf70 Binary files /dev/null and b/patternlab.png differ diff --git a/scripts/build.js b/scripts/build.js new file mode 100644 index 0000000..ae6c13c --- /dev/null +++ b/scripts/build.js @@ -0,0 +1,13 @@ +/* + This is another simple example, which we wrapped with an `npm` script inside package.json +*/ +const config = require('./../patternlab-config.json'); +const patternlab = require('@pattern-lab/patternlab-node')(config); + +patternlab.build(() => { + // use the callback +}, { + cleanPublic: true +}).then(() => { + // or do something else when this promise resolves +}); diff --git a/scripts/help.js b/scripts/help.js new file mode 100644 index 0000000..95294e7 --- /dev/null +++ b/scripts/help.js @@ -0,0 +1,7 @@ +/* + This is another simple example, which we wrapped with an `npm` script inside package.json +*/ +const config = require('./../patternlab-config.json'); +const patternlab = require('@pattern-lab/patternlab-node')(config); + +patternlab.help(); diff --git a/scripts/postinstall.js b/scripts/postinstall.js deleted file mode 100644 index 45cf9bb..0000000 --- a/scripts/postinstall.js +++ /dev/null @@ -1,5 +0,0 @@ -"use strict"; -console.log('Beginning Pattern Lab Node postinstall...'); - -//call the core library postinstall -var patternlab = require('patternlab-node/core/scripts/postinstall'); diff --git a/scripts/serve.js b/scripts/serve.js new file mode 100644 index 0000000..b5e35e1 --- /dev/null +++ b/scripts/serve.js @@ -0,0 +1,13 @@ +/* + This is another simple example, which we wrapped with an `npm` script inside package.json +*/ +const config = require('./../patternlab-config.json'); +const patternlab = require('@pattern-lab/patternlab-node')(config); + +patternlab.serve(() => { + // use the callback +}, { + cleanPublic: true, +}).then(() => { + // or do something else when this promise resolves +}); diff --git a/source/_annotations/README.md b/source/_annotations/README.md new file mode 100644 index 0000000..42592a0 --- /dev/null +++ b/source/_annotations/README.md @@ -0,0 +1,5 @@ +This is the default location to place annotations. + +Pattern Lab uses annotations defined here to markup the UI. Read more about [annotations](http://patternlab.io/docs/pattern-adding-annotations.html). + +If you wish to rename this directory, make sure you update the `paths.source.annotations` property within `patternlab-config.json`. diff --git a/source/_data/README.md b/source/_data/README.md new file mode 100644 index 0000000..3b9ea1e --- /dev/null +++ b/source/_data/README.md @@ -0,0 +1,5 @@ +This is the default location to place global data files. + +Pattern Lab uses data defined here as the global fallback if a template does not provide its own data. Read more about [data](http://patternlab.io/docs/data-overview.html). + +If you wish to rename this directory, make sure you update the `paths.source.data` property within `patternlab-config.json`. diff --git a/source/_meta/README.md b/source/_meta/README.md new file mode 100644 index 0000000..c6c8c3b --- /dev/null +++ b/source/_meta/README.md @@ -0,0 +1,5 @@ +This is the default location to place meta files, otherwise known a pattern's header and footer. + +Pattern Lab builds each pattern while prepending and appending the header and footer. Read more about [pattern headers and footers](http://patternlab.io/docs/pattern-header-footer.html). + +If you wish to rename this directory, make sure you update the `paths.source.meta` property within `patternlab-config.json`. diff --git a/source/_patterns/README.md b/source/_patterns/README.md new file mode 100644 index 0000000..2f89266 --- /dev/null +++ b/source/_patterns/README.md @@ -0,0 +1,5 @@ +This is the default location to place pattern files. + +Pattern Lab builds patterns and the ui from the structure defined within. Read more about [pattern organization](http://patternlab.io/docs/pattern-organization.html). + +If you wish to rename this directory, make sure you update the `paths.source.patterns` property within `patternlab-config.json`. diff --git a/source/css/README.md b/source/css/README.md new file mode 100644 index 0000000..a6ce7bf --- /dev/null +++ b/source/css/README.md @@ -0,0 +1,5 @@ +This is the default location to place global css files. + +The entire contents of this directory will be recursively copied to your configured `public/` directory. + +If you wish to rename this directory, make sure you update the `paths.source.css` property within `patternlab-config.json`. diff --git a/source/favicon.ico b/source/favicon.ico new file mode 100644 index 0000000..eee4aa7 Binary files /dev/null and b/source/favicon.ico differ diff --git a/source/fonts/README.md b/source/fonts/README.md new file mode 100644 index 0000000..ff4d4de --- /dev/null +++ b/source/fonts/README.md @@ -0,0 +1,5 @@ +This is the default location to place global font files. + +The entire contents of this directory will be recursively copied to your configured `public/` directory. + +If you wish to rename this directory, make sure you update the `paths.source.fonts` property within `patternlab-config.json`. diff --git a/source/images/README.md b/source/images/README.md new file mode 100644 index 0000000..86c91d5 --- /dev/null +++ b/source/images/README.md @@ -0,0 +1,5 @@ +This is the default location to place global image files. + +The entire contents of this directory will be recursively copied to your configured `public/` directory. + +If you wish to rename this directory, make sure you update the `paths.source.images` property within `patternlab-config.json`. diff --git a/source/js/README.md b/source/js/README.md new file mode 100644 index 0000000..8578938 --- /dev/null +++ b/source/js/README.md @@ -0,0 +1,5 @@ +This is the default location to place global javascript files. + +The entire contents of this directory will be recursively copied to your configured `public/` directory. + +If you wish to rename this directory, make sure you update the `paths.source.js` property within `patternlab-config.json`.