feat(filter): add stylus filter to extend

.gitignore

@@ -4,3 +4,4 @@ tmp/
 *.log
 .idea/
 .nyc_output/
+yarn.lock

README.md

@@ -72,3 +72,27 @@ theme_config:
 
 [Stylus]: http://stylus-lang.com/
 [nib]: http://stylus.github.io/nib/
+
+## Extensibility
+
+This plugin provide a filter `stylus:renderer` to allows you extend it. When there’s something you cannot do in Stylus, define it in JavaScript!
+
+For example, to define some global variable:
+
+```js
+hexo.extend.filter.register('stylus:renderer', function(style) {
+ style
+ // we may define a global variable by passing a `Node`
+ .define('has-canvas', require('stylus').nodes.false);
+ // stylus also casts JavaScript values to their Stylus equivalents when possible
+ .define('families', ['Helvetica Neue', 'Helvetica', 'sans-serif'])
+ // also allows you to provide a JavaScript-defined function to Stylus
+ .define('get-list', function(){
+ return ['foo', 'bar', 'baz'];
+ });
+})
+```
+
+Save the file in "scripts/" folder and run Hexo as usual.
+
+Notice: for more JavaScript api, refer to stylus's [documentation](http://stylus-lang.com/docs/js.html).

lib/renderer.js

@@ -51,6 +51,7 @@ module.exports = function(data, options, callback) {
 
  stylusConfig
  .use(defineConfig)
+ .use(style => this.execFilterSync('stylus:renderer', style, {context: this}))
  .set('filename', data.path)
  .set('sourcemap', config.sourcemaps)
  .set('compress', config.compress)

package.json

@@ -28,14 +28,15 @@
  "author": "Tommy Chen <[email protected]> (http://zespia.tw)",
  "license": "MIT",
  "dependencies": {
- "stylus": "^0.54.5",
- "nib": "^1.1.2"
+ "nib": "^1.1.2",
+ "stylus": "^0.54.5"
  },
  "devDependencies": {
  "chai": "^4.2.0",
  "chai-as-promised": "^7.1.1",
  "eslint": "^7.1.0",
  "eslint-config-hexo": "^4.0.0",
+ "hexo": "^5.0.2",
  "mocha": "^8.0.1",
  "nyc": "^15.0.0"
  },

test/index.js

@@ -1,9 +1,11 @@
 'use strict';
 
 const should = require('chai').should(); // eslint-disable-line
+const Hexo = require('hexo');
 
 describe('Stylus renderer', () => {
- const ctx = {
+ const hexo = new Hexo(__dirname, {silent: true});
+ const ctx = Object.assign(hexo, {
  config: {
  stylus: {
  compress: false
@@ -21,7 +23,7 @@ describe('Stylus renderer', () => {
  }
  }
  }
- };
+ });
 
  const r = require('../lib/renderer').bind(ctx);
 
@@ -147,4 +149,37 @@ describe('Stylus renderer', () => {
  ].join('\n') + '\n');
  });
  });
+
+ describe('exec filter to extend', () => {
+ it('should execute filter registered to stylus:renderer', () => {
+ const hexo = new Hexo(__dirname, {silent: true});
+ Object.assign(hexo, {
+ config: {
+ stylus: {
+ compress: false
+ }
+ }
+ });
+ hexo.extend.filter.register('stylus:renderer', style => {
+ style.define('examples', () => {
+ return 'foo';
+ });
+ });
+ const filterRender = require('../lib/renderer').bind(hexo);
+ const body = [
+ '.foo',
+ ' content: examples()',
+ ''
+ ].join('\n');
+ filterRender({text: body}, {}, (err, result) => {
+ if (err) throw err;
+ result.should.eql([
+ '.foo {',
+ ' content: \'foo\';',
+ '}'
+ ].join('\n') + '\n');
+ });
+ });
+ });
+
 });