How to use the nib function in nib

To help you get started, we’ve selected a few nib 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 cncjs / cncjs / gulp / tasks / stylus.js View on Github external
import gulp from 'gulp';
import stylus from 'gulp-stylus';
import sourcemaps from 'gulp-sourcemaps';
import nib from 'nib';

const stylusConfig = {
    src: ['src/web/**/*.styl'],
    dest: 'src/web/',
    options: {
        compress: true,
        // nib - CSS3 extensions for Stylus
        use: nib(),
        import: ['nib'] // no need to have a '@import "nib"' in the stylesheet
    }
};

export default (options) => {
    gulp.task('stylus', () => {
        return gulp.src(stylusConfig.src)
            .pipe(sourcemaps.init())
                .pipe(stylus(stylusConfig.options))
            .pipe(sourcemaps.write('/', { includeContent: false }))
            .pipe(gulp.dest(stylusConfig.dest));
    });
};
github Gravebot / Gravebot / src / express.js View on Github external
app.get('/style/:file', (req, res) => {
    const css_path = path.join(__dirname, `../web/css/${req.params.file}`);
    if (nconf.get('NODE_ENV') !== 'development') {
      if (!fs.existsSync(css_path)) return res.redirect('/404');
      return res.sendFile(css_path);
    }

    const styl_path = css_path.replace(/css/g, 'styl');
    if (!fs.existsSync(styl_path)) return res.redirect('/404');
    stylus(fs.readFileSync(styl_path, 'utf8'))
      .set('src', path.join(__dirname, '../web/styl'))
      .set('filename', path.basename(styl_path))
      .set('compress', true)
      .use(nib())
      .render((err, css) => {
        if (err) {
          console.error(err);
          return res.status(500).send(err);
        }
        res.status(200).send(css);
      });
  });
github carlosazaustre / universal-js-boilerplate / tasks / gulp-build-css.js View on Github external
export default () => {
  return gulp
    .src(config.styles.main)
    .pipe(stylus({
      use: nib(),
      'include css': true
    }))
    .pipe(minifyCSS())
    .pipe(gulp.dest(config.output));
};
github jsonmaur / jumpsuit / src / cli / compilers / stylus.js View on Github external
const output = path.resolve(
    getConfig().output,
    path.basename(getConfig().entryStyl, '.styl')
  ) + '.css'

  const nibFile = resolve.sync('nib/lib/nib/index.styl', {
    basedir: process.cwd(),
  })

  stylus(fs.readFileSync(getConfig().entryStyl, 'utf8'))
    .set('filename', getConfig().entryStyl)
    .set('include css', true)
    .set('hoist atrules', true)
    .set('compress', process.env.NODE_ENV === 'production')
    .set('sourcemap', { inline: process.env.NODE_ENV === 'development' })
    .use(nib())
    .import(nibFile)
    .set('paths', [getConfig().source])
    .render((err, css) => {
      if (err) return cb(err)

      if (process.env.NODE_ENV === 'production') {
        css = new Clean().minify(css).styles
      }

      fs.writeFileSync(output, css)
      triggerRefresh('css_refresh')

      cb()
    })
}, { wait: 300 })
github acauamontiel / mantis-starter / gulpfile.babel.js / tasks / css.js View on Github external
export default function cssTask (done) {
	if (!prod) {
		src(css.watch)
			.pipe(stylint())
			.pipe(stylint.reporter());
	}

	src(css.src)
		.pipe(plumber())
		.pipe(stylus({
			use: [
				nib(),
				equalizr(),
				querist(),
				grid(),
				layers()
			],
			compress: prod,
			linenos: !prod,
			errors: true
		}))
		.pipe(dest(css.dest))
		.pipe(stream());

	done();
};
github shesek / spark-wallet / client / serve.js View on Github external
const compileStyl = (str, filename) => stylus(str).set('filename', filename).use(nib())
    , bswatchPath = path.resolve(require.resolve('bootswatch/package'), '..', 'dist')
github meteor-vue / vue-meteor / packages / vue-stylus / vue-stylus.js View on Github external
return fs.readFileSync(filePath, 'utf8')
    },
  }

  function processSourcemap (sourcemap) {
    delete sourcemap.file
    sourcemap.sourcesContent = sourcemap.sources.map(importer.readFile)
    sourcemap.sources = sourcemap.sources.map((filePath) => {
      return parseImportPath(filePath) || filePath
    })

    return sourcemap
  }

  let renderer = stylus(source)
    .use(nib())
    .set('filename', basePath)
    .set('sourcemap', { inline: false, comment: false })
    .set('cache', true)
    .set('importer', importer)

  renderer.render((err, css) => {
    if (err) {
      cb(err, null)
    } else {
      renderer.deps(basePath).forEach(file => dependencyManager.addDependency(file))
      const map = processSourcemap(renderer.sourcemap)
      cb(null, {
        css,
        map,
      })
    }
github jsonmaur / jumpsuit / src / cli / watch.js View on Github external
const dCssStyle = debounce((cb) => {
  const ms = Date.now()
  log('updating styles...')

  const input = path.resolve(process.cwd(), 'src/app.styl')
  const output = path.resolve(process.cwd(), 'dist/app.css')

  stylus(fs.readFileSync(input, 'utf8'))
    .set('include css', true)
    .set('hoist atrules', true)
    .use(nib())
    .import(path.resolve(__dirname, '../../node_modules/nib/lib/nib/index.styl'))
    .set('paths', [
      path.resolve(process.cwd(), 'src'),
    ])
    .render((err, css) => {
      if (err) return cb(err)

      fs.writeFileSync(output, css)
      log('styles updated', chalk.dim(`(${Date.now() - ms}ms)`))
      triggerCssRefresh()
    })
}, 300)

nib

Stylus mixins and utilities

MIT
Latest version published 3 years ago

Package Health Score

57 / 100
Full package analysis

Popular nib functions