The Acorn Spirit’s Journey

utf-8ばかりなこの頃ですが、最近、仕事でShift_JISで作る必要があり・・
普通にShift_JISで作っちゃうと、Gulp経由は文字化けしちゃって仕事にならないんですよね。。

そこで、作業中はutf-8で作り
（ローカルサーバ立ち上げて見た目を確認するのもutf-8でやる）
後にShift_JISに変換するよう、gulpfile.jsに追記しました。

// convert encoding
const gulp = require('gulp');
const through2 = require('through2');
const iconv = require('iconv-lite');

gulp.task('convertToShift_JIS', function() {
    return gulp.src('src/**/*.html')
        .pipe(through2.obj(function (file, _, cb) {
        let content = file.contents.toString('utf8');

        // メタタグ内のcharset属性の値を変更する
        content = content.replace(/(<meta[^>]+charset=")[^"]+("[^>]*>)/gi, '$1Shift_JIS$2');

        // 文字コードを変換
        file.contents = iconv.encode(content, 'Shift_JIS');

        this.push(file);
        cb();
    }))
    .pipe(gulp.dest('dist/'));
});

上記のタスクは、コマンドプロンプトから
『 gulp convertToShift_JIS 』
エンター！で実行。

メタタグ内のcharsetをShift_JISに書き換えて、文字コードも変換します。

ローカルサーバではdistフォルダを参照するよう、gulpfile.jsで設定してる場合がほとんどかと思われますが、今回はsrcフォルダにしておきます。

// ローカルサーバ起動
const buildServer = done => {
    browserSync.init({
        server: {
            baseDir: 'src/'
        }
    })
    done();
}

srcフォルダはutf-8、distフォルダにはShift_JIS、と分けた形になります。

変換されたhtmlをブラウザで見てみますと、残念ながら多少の文字化けがあったりするので
「?」になっている個所をひとつひとつ書き換える。。。