PUG（npm/gulp）でローカルHTMLファイルを生成

Question

gulpを使用して保存するたびに、自分のpugファイルと同じ名前のHTMLファイルを作成するにはどうすればよいですか？

https://pugjs.org/上のすべてのドキュメントのコンソールにパグを返す方法を説明し...

Answer 1

あなたはそのためのタスクランナーやモジュールバンドラが必要です。したがって、1つの-grunt/gulp/webpackを選択します。 webpackを最新かつ幅広い機能として考えてみましょう。

ここでの例の幅グルプ私の視点からわかりやすいです。

最初にnpmをインストールし、pugをコンパイルして変更を監視するパッケージ - npm install --save gulp-pug gulp-watch。

次に、gulpfile.jsを作成して設定します。

まず輸入npmモジュール

var pug = require('gulp-pug'); 
var watch = require('gulp-watch'); 

は、次にタスク

gulp.task('pug',function() { 
return gulp.src('PATH_TO_TEMPLATES/*.jade') 
.pipe(pug({ 
    doctype: 'html', 
    pretty: false 
})) 
.pipe(gulp.dest('./src/main/webapp/')); 
}); 

をコンパイル作成し、ウォッチャー

gulp.task('watch', function() { 
return watch('PATH_TO_TEMPLATES/*.jade', { ignoreInitial: false }) 
    .pipe(gulp.dest('pug')); 
}); 

を作成し、コンソールあなたからgulp-watchを実行します。