Webpack の devServer でファイル毎のContent-Type（mime）を設定する / magicien　

この方法で正しいのかよく分からないけど、とりあえず動いたので忘れないうちにメモしておく。


webpack-dev-serverで、.exr という拡張子のファイルの Content-Type を "image/x-exr" で返したいんだけど、どうすればいいのかな？と思って適当にいじってたらなんか動いた。

var webpack = require('webpack');
var WebpackDevServer = require('webpack-dev-server');
new WebpackDevServer(webpack(config.webpack), config.webpack.devServer).listen(...)

devServerを初期化するときは、こんな感じで config.webpack.devServer をオプションとして渡しているのだけれど、このオプションをこんな感じで書いた。

{
    staticOptions: {
        setHeaders: (res, path, stat) => {
            if(/.exr$/.test(path)){
                res.setHeader('Content-Type', 'image/x-exr')
            }
        }
    }
}

思いっきり関数埋め込んでますが。まぁ大改造したわけでもないし、これで良しとする。

ブラウザで表示してみて気づいたけど、exrファイル対応してるのSafariだけっぽい？そもそも読み込めたとしてどうやってシェーダに送るかという問題もあるか。データ構造自体はそんなに複雑じゃないっぽいけど、いざパーサを書こうとすると、データが圧縮されてるのがきつい。ぐぬぬ...