pfist / yoko Goto Github PK

I turned lib/config into a separate package and published it on NPM, so let's use that instead.

Tasks

• New code architecture to accommodate Gulp #4
• Replace metalsmith-sass with gulp-sass
• Add gulp-autoprefixer
• Add image optimization
• Add JS optimization
• Explore caching/incremental build plugins
• Create Gulp task series to match Yoko commands

Why Gulp?

Most of Yoko's file processing currently relies on Metalsmith and its plugin ecosystem. Unfortunately, some of the plugins contain old/deprecated dependencies. I could submit PRs to update those plugins, but right now I think my time is better spent working on Yoko. I also considered using the vanilla modules (i.e. autoprefixer instead of metalsmith-autoprefixer), but integrating them with Metalsmith is difficult.

I'd like to migrate from Metalsmith to Gulp, for a few reasons:

• Better plugin ecosystem
• More flexible build chain
• Great caching plugins for incremental building
• Easy to integrate with BrowserSync
• Any Gulp task can run a Metalsmith instance
• I like the API

This first phase of the migration will involve a complete redesign of the code architecture for Yoko as well as replacing any asset-related plugins with Gulp equivalents. Content and template processing will require a more significant effort, so I'm punting that to a future release for now. Gulp will handle asset processing and overall build task management. Metalsmith will continue to handle content and templates.

I was going to pull lib/titlecase and lib/capitalize out into a single, separate package and publish it on NPM. Turns out Blake Embrey's title-case is a great existing package that does the same thing, so I'll go ahead and just use that instead.

I recently pulled lib/cname out into a new separate package called john-cname. It does the same thing but better, and even has unit tests. 🙀

I should use that package now.

I'm re-organizing the app to accommodate Gulp as discussed in #3. Right now the app is structured like this:

bin/
- cli.js
lib/
- config.js
- yoko.js
themes/

All of the command logic lives in yoko.js, which gets imported into cli.js to offer a clean API for calling the right method for each command.

The new Gulp-ified structure will be more like this:

bin/
- yoko.js
gulp/
- tasks/
- - sass.js
- - images.js
- - etc.
- gulpfile.js

Everything related to Gulp will live in the gulp/ directory to keep things organized and easy to reason about. Each task will live in a <task>.js file under the tasks/ sub-directory. All of the tasks will be imported into gulpfile.js using require-dir.

How Yoko will utilize Gulp

Normally you install Gulp locally as a dependency of your project, but since Yoko is a globally-available CLI, Gulp has to live in a global module but process files in your current working directory. To do this, I'll need to require both Gulp and the Gulpfile in the executable, which will allow me to run Gulp tasks there.