Search code examples
windowsvisual-studiowebcharacter-encodinggulp

Encoding problems with gulp on Windows

I have several source files in a Visual Studio 2013 wep application project that I process using gulp version 3.8.11. Those files are Unicode (UTF-8 with signature) - Codepage 65001 encoded text files. After process them, they appear as they were Windows 1252 encoded text files.

For example, given the following UTF-8 encoded src/hello.html file:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Hello</title>
</head>
<body>
    <h1>Hello, my name is Jesús López</h1>
</body>
</html>

This is how it looks on the browser:

enter image description here

Using the following gulpfile.js:

var gulp = require('gulp');

gulp.task('build', function () {
    gulp.src('src/hello.html')
        .pipe(gulp.dest('dist'));
});

After executing gulp build on the command line, this is how it looks on the browser:

enter image description here

How can I solve this encoding problem? Please help.

Solution

  • I had the same problem with .cshtml files, I found out that it was because of a missing UTF-8 BOM. That can easily be added with a gulp-plugin called gulp-header.

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

gulp.task('build', function () {
    gulp.src('src/hello.html')
        .pipe(header('\ufeff'));
        .pipe(gulp.dest('dist'));
});