https://github.com/phase2/p2-theme-core
Core configuration for Pattern Lab Starter/Particle v9
https://github.com/phase2/p2-theme-core
gulp-tasks
Last synced: 5 months ago
JSON representation
Core configuration for Pattern Lab Starter/Particle v9
- Host: GitHub
- URL: https://github.com/phase2/p2-theme-core
- Owner: phase2
- Created: 2015-10-27T19:05:46.000Z (over 10 years ago)
- Default Branch: master
- Last Pushed: 2021-07-17T13:21:32.000Z (over 4 years ago)
- Last Synced: 2025-04-18T04:35:41.668Z (11 months ago)
- Topics: gulp-tasks
- Language: JavaScript
- Homepage:
- Size: 1.48 MB
- Stars: 16
- Watchers: 19
- Forks: 22
- Open Issues: 8
-
Metadata Files:
- Readme: readme.md
- Changelog: CHANGELOG.md
- Contributing: CONTRIBUTING.md
Awesome Lists containing this project
README
[](http://p2-theme-core.readthedocs.org/en/latest/?badge=latest) [](https://travis-ci.org/phase2/p2-theme-core)
[](https://nodei.co/npm/p2-theme-core)
[](https://nodei.co/npm/p2-theme-core)
# Prerequisites
- p2-theme-core v9: Node >=4.0.0 >=8.0.0
- p2-theme-core v10: Node >=6.0.0 <=8.0.0
**This is one of two pieces of our themes:**
- [`pattern-lab-starter`](https://github.com/phase2/particle/tree/release/9.x) - a starter set of files for Drupal theming that includes a Twig powered Pattern Lab and beginning Sass & other front end tools. Uses `p2-theme-core` for automation.
- [`p2-theme-core`](https://github.com/phase2/p2-theme-core) (this repo) - the core gulp tasks that handles most of the theme's automation.
# Phase2 Theme Core
Ideally, the changes to how a theme install works would be done by passing in a different `config.js`.
**More docs in [`docs/`](https://github.com/phase2/p2-theme-core/tree/master/docs) folder – these docs are [hosted in Read the Docs](http://p2-theme-core.readthedocs.org)!**
# Features
- Scss => CSS compiling with Libsass, PostCSS, linting, and SourceMaps
- Pattern Lab Twig compiling & BrowserSync live reload and style injection
- SVG => Font Icons compiling with support for adding mixins and classes to Scss along with a demo page in Pattern Lab
- JS compiling via Babel, linting and aggregation
- WebPack module bundling
- Drupal file watching to trigger Drush cache clears
All is easily configurable by changing values in your `config.js` file in your project. These values are merged into the `config.default.js` file - look there for the available options and defaults.
# Installation
It's best to look at how [`pattern-lab-starter`](https://github.com/phase2/pattern-lab-starter) implements this, but it's basically this:
npm install p2-theme-core --save
cp node_modules/p2-theme-core/config.default.js gulpconfig.js
Make a `gulpfile.js` with:
```js
'use strict';
var gulp = require('gulp');
var config = require('./gulpconfig.js');
var tasks = {
'compile': [],
'watch': [],
'validate': [],
'clean': [],
'default': []
};
require('p2-theme-core')(gulp, config, tasks);
gulp.task('clean', gulp.parallel(tasks.clean));
gulp.task('compile', gulp.series(
'clean',
gulp.parallel(tasks.compile)
));
gulp.task('validate', gulp.parallel(tasks.validate));
gulp.task('watch', gulp.parallel(tasks.watch));
tasks.default.push('watch');
gulp.task('default', gulp.series(
'compile',
gulp.parallel(tasks.default)
));
```