13
15

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

gulpのインストール→Stylusのコンパイル

Last updated at Posted at 2014-06-30

まずは、gulpをインストール

sudo npm install -g gulp

適当な場所にプロジェクトフォルダを作る

mkdir -p project/stylus project/css
cd project

gulpをプロジェクトにインストール

npm install --save-dev gulp

続いて、Stylusのプラグインをインストール

npm install gulp-stylus

gulpfile.jsファイルを作る

var gulp = require('gulp');
var stylus = require('gulp-stylus');

gulp.task('stylus', function() {
    gulp.src('stylus/*')
      .pipe(stylus())
      .pipe(gulp.dest('css/'));
});

Stylusファイルを「stylus」フォルダ内に作成する

body
	background-color: #ccc
	
	.main
		font-size: 10px

gulpを起動

gulp stylus

CSSフォルダ内に、.cssファイルが生成されていればOK。

13
15
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
13
15

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?