How to use stylus - 10 common examples

To help you get started, we’ve selected a few stylus examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github ThisIsManta / stylus-supremacy / test / runner.js View on Github external
it('can be formatted', () => {
			if (fs.existsSync(inputFormattedFilePath)) fs.unlinkSync(inputFormattedFilePath)

			try {
				const tree = new Stylus.Parser(inputContent).parse()
				fs.writeFileSync(inputDebuggingFilePath, JSON.stringify(tree, null, '\t'))
			} catch (ex) {
				// Do nothing
			}

			const actualContent = format(inputContent, formattingOptions)

			const errorMessage = compareContent(actualContent, outputContent)
			if (errorMessage) {
				fs.writeFileSync(inputFormattedFilePath, actualContent)

				const stack = [
					inputFilePath,
					inputFormattedFilePath,
					inputDebuggingFilePath,
					outputFilePath,
github nitin42 / stylus-in-react / utils / testParser.js View on Github external
function parseStylus(stylusCode) {
	let AST, rules, stylesheet, hash, selectors, element;

	stylus.render(stylusCode, { filename: 'source.css' }, (err, css) => {
		// throws parse errors
		if (err) {
			throw new Error('Indentation error');
		}

		// Generate css AST
		AST = parser.parse(css, { source: 'css' });

		// Get the root selector
		selectors = AST.stylesheet.rules[0] !== undefined ? AST.stylesheet.rules[0].selectors : null;

		// Set the root element
		element = getParentNode(selectors);

		// Style rules
		rules = AST.stylesheet.rules;
github yandex-ui / nanoislands / build / build-styl.js View on Github external
var content = [
    'ie = ' + ie.toString(),
    '@import "node_modules/stylobate";',
    'rem = rem_px',
    '@import "node_modules/stylobate-islands";',
    'set-skin-namespace("islands");',
    '@import "nanoislands.styl";'
].join('\n');

var stylus = require('stylus');
var autoprefixer = require('autoprefixer');
var style = stylus(content)
    .set('filename', ie ? 'nanoislands.ie.css' : 'nanoislands.css')
    .set('resolve url', true)
    .define('url', stylus.resolver());

style.render(function(err, css) {
    var browsers = [
        // эти браузеры прибиты по версиям
        'Opera 12',
        'Safari >= 6',
        'Explorer >= 9',
        // эти браузеры обновляются автоматически
        'last 5 Chrome versions',
        'last 5 Firefox versions',
        'last 5 Opera versions'
    ]

    if (err) {
        console.error(err);
        process.exit(1);
github ekiwan / Dotametrics / server.js View on Github external
var express = require('express');
var stylus = require('stylus');
var nib = require('nib');
var replay = require('./replay.js');
var app = express();

console.log(replay.countRunes());

// Log requests
app.use(express.logger());

// Compile Stylus files
app.use(stylus.middleware({
  src: __dirname + '/public/styles/',
  dest: __dirname + '/public/styles/',
  compile: function(str, path) {
    return stylus(str)
      .set('filename', path)
      .set('compress', true)
      .use(nib());
  }
}));

//api routes
require('./routes.js')(app);

// Serve static files
app.use(express.static(__dirname + '/public'));
github artsy / positron / lib / assets.js View on Github external
// Browserify + Transforms
  if (path.extname(file) == '.js' || path.extname(file) == '.coffee') {
    var b = browserify().add(assetsDir + file);
    try { b.transform(require('caching-coffeeify')) } catch (e) {};
    try { b.transform(require('jadeify')) } catch (e) {};
    try { b.transform(require('uglifyify')) } catch (e) {};
    b.bundle(function(err, buf) {
      if (err) return errExit(err);
      fs.writeFileSync(publicDir + file.split('.')[0] + '.js', buf);
    });
  }

  // Stylus + Sqwish
  try { var stylus = require('stylus'); } catch (e) {};
  if (stylus && path.extname(file) == '.styl') {
    stylus.render(fs.readFileSync(assetsDir + file).toString(), {
      filename: assetsDir + file
    }, function(err, css) {
      if (err) return errExit(err);
      try { var css = require('sqwish').minify(css) } catch (e) {};
      fs.writeFileSync(publicDir + file.split('.')[0] + '.css', css);
    });
  }
});
github ThisIsManta / stylus-supremacy / edge / format.js View on Github external
modifiedContent = 'wrap\n' + originalLines.map(line => {
				if (line.trim().length > 0) {
					return (originalTabStopChar || '\t') + line.substring(twoShortestIndent[0].length)
				} else {
					return ''
				}
			}).join('\n')
		}
	}

	// Used to determine some information that `rootNode` does not offer
	// For example, a single-line comment
	const modifiedLines = modifiedContent.split(/\r?\n/)

	// Store the Stylus parsed tree
	const rootNode = new Stylus.Parser(modifiedContent).parse()

	// Return the original content if it only has comments
	if (rootNode.nodes.every(node => node instanceof Stylus.nodes.Comment)) {
		return content
	}

	function travel(parentNode, inputNode, indentLevel, insideExpression = false, data = {}) {
		// Check argument type
		if (!(_.isObject(parentNode) || parentNode === null && inputNode instanceof Stylus.nodes.Root)) {
			throw new Error(`Found a parent node of ${JSON.stringify(parentNode)}`)
		} else if (!(_.isObject(inputNode))) {
			throw new Error(`Found an input node of ${JSON.stringify(inputNode)}` + (parentNode ? `, which had a parent node of ${JSON.stringify(parentNode)}` : ''))
		} else if (!(_.isInteger(indentLevel) && indentLevel >= 0)) {
			throw new Error(`Found an indent level of ${JSON.stringify(indentLevel)}`)
		} else if (!(_.isBoolean(insideExpression))) {
			throw new Error(`Found an expression flag of ${JSON.stringify(insideExpression)}`)
github chenckang / react-json-pretty / example / node_modules / stylus-loader / lib / pathcache.js View on Github external
function resolvers(options, webpackResolver) {
  var evaluator = new Evaluator(nodes.null, options);
  var whenWebpackResolver = whenNodefn.lift(webpackResolver);
  return [
    // Stylus's normal resolver for single files.
    function(context, path) {
      // Stylus adds .styl to paths for normal "paths" lookup if it isn't there.
      if (!/.styl$/.test(path)) {
        path += '.styl';
      }

      var found = utils.find(path, options.paths, options.filename)
      if (found) {
        return normalizePaths(found);
      }
    },
    // Stylus's normal resolver for node_modules packages. Cannot locate paths
    // inside a package.
github shama / stylus-loader / lib / pathcache.js View on Github external
function resolvers(options, webpackResolver) {
  var evaluator = new Evaluator(nodes.null, options);
  var whenWebpackResolver = whenNodefn.lift(webpackResolver);

  // Stylus's normal resolver for single files.
  var stylusFile = function(context, path) {
    // Stylus adds .styl to paths for normal "paths" lookup if it isn't there.
    if (!/.styl$/.test(path)) {
      path += '.styl';
    }

    var paths = options.paths.concat(context);
    var found = utils.find(path, paths, options.filename)
    if (found) {
      return normalizePaths(found);
    }
  };
github shama / stylus-loader / lib / evaluator.js View on Github external
// Parse the file
  importStack.push(file);
  nodes.filename = file;

  var str;
  if (this.cache.sources && this.cache.sources[file]) {
    str = this.cache.sources[file];
  } else {
    str = fs.readFileSync(file, 'utf8');
  }

  if (literal && !this.resolveURL) return new nodes.Literal(str.replace(/\r\n?/g, '\n'));

  // parse
  var block = new nodes.Block
    , parser = new Parser(str, utils.merge({ root: block }, this.options));

  try {
    block = parser.parse();
  } catch (err) {
    err.filename = file;
    err.lineno = parser.lexer.lineno;
    err.input = str;
    throw err;
  }

  // Evaluate imported "root"
  block.parent = this.root;
  block.scope = false;
  var ret = this.visit(block);
  importStack.pop();
github mockingbot / ibot / scripts / stylus-enhanced-evaluator.js View on Github external
// Avoid overflows from importing the same file over again
  if (file === importStack[importStack.length - 1]) return nodes.null

  if (this.options._imports) this.options._imports.push(node.clone())

  // Parse the file
  importStack.push(file)
  nodes.filename = file

  var str = fs.readFileSync(file, "utf8")

  if (literal && !this.resolveURL)
    return new nodes.Literal(str.replace(/\r\n?/g, "\n"))

  // parse
  var block = new nodes.Block(),
    parser = new Parser(str, utils.merge({ root: block }, this.options))

  try {
    block = parser.parse()
  } catch (err) {
    err.filename = file
    err.lineno = parser.lexer.lineno
    err.input = str
    throw err
  }

  // Evaluate imported "root"
  block.parent = this.root
  block.scope = false
  var ret = this.visit(block)
  importStack.pop()