ejsのオプションを見直す

以前の記事(`gulp-ejs`で冒頭の余白を詰めたりHTMLコメントを除去したり)でgulp-ejsを使用したタスクの中でスペースなどのトリムを行っていました。

const configHtmlMin = {  
    removeComments : true  
};  
const htmlInitDel = /[\s\S]*?(<!DOCTYPE)/i;  
const htmlSpaceLineDel = /[ ]+(\r\n|\n|\r)+/gi;  

const ejs = () => {  
    return gulp.src('./src/ejs/**/*.ejs')  
        .pipe(plumber())  
        .pipe(data((file) => {  
                return { 'filename': file.path }  
            }))  
        .pipe(ejs({ params }))  
        .pipe(rename({ extname: '.html' }))  
        .pipe(replace(htmlInitDel, '$1'))  
        .pipe(htmlmin(configHtmlMin))  
        .pipe(replace(htmlSpaceLineDel, ''))  
        .pipe(gulp.dest(dir.dist.html));  
};

特に DOCTYPE 宣言前の空白を除去する .pipe(_.replace(/[\s\S]*?(<!DOCTYPE)/, '$1')) の部分ですね。

※ちなみに .pipe(_.htmlmin(jsConfig.configHtmlMin)) はejsのコメントを削除、 .pipe(_.replace(jsConfig.htmlSpaceLineDel, '')) は前述のコメント削除の結果インデントのみ残った部分を削除する処理を行っています。

ところが、先日EJSのドキュメントを改めて読み直してみると以下の既述に気付きました。

  • -%> Trim-mode (‘newline slurp’) tag, trims following newline

……これを使えば上述の .pipe(_.replace(/[\s\S]*?(<!DOCTYPE)/, '$1')) の処理がいらなくなるのでは?

<%
parameters = {
    //略
}
%><%- include("util/_init_load") %>
<!DOCTYPE html>

試しにこれを

<%
parameters = {
    //略
}
%->
<%- include("util/_init_load") -%>
<!DOCTYPE html>

こう。

const configHtmlMin = {  
    removeComments : true  
};  
const htmlSpaceLineDel = /[ ]+(\r\n|\n|\r)+/gi;  

const ejs = () => {  
    return gulp.src('./src/ejs/**/*.ejs')  
        .pipe(plumber())  
        .pipe(data((file) => {  
                return { 'filename': file.path }  
            }))  
        .pipe(ejs({ params }))  
        .pipe(rename({ extname: '.html' }))  
        .pipe(htmlmin(configHtmlMin))  
        .pipe(replace(htmlSpaceLineDel, ''))  
        .pipe(gulp.dest(dir.dist.html));  
};

微妙な差分ですが、先ほどの置換処理を一つ減らしています。

これで問題なく動作することが確認できたのでfix。

参考

この記事を書いた人

アルム=バンド

フロントエンド・バックエンド・サーバエンジニア。LAMPやNodeからWP、Gulpを使ってejs,Scss,JSのコーディングまで一通り。たまにRasPiで遊んだり、趣味で開発したり。