node-webkitでTypeScriptを使ってはまるケース

JavaScript memo

node-webkitのJavaScript Contextでのrequireでのパス解決でハマる場合がある。

例えばこんなファイル構成で

  • index.html
  • js
    • index.js(index.ts)
    • fileUploader.js

各ファイルがこんな感じ。

<!-- index.html -->
<!DOCTYPE html>
<html>
  <head >
    <meta charset="utf-8" />
    .................
    <script src="js/index.js"></script>
  </body>
</html>

//js/index.js
..................
var fileUploader = require('./js/fileUploader');
.................
//↑node-webkit的に問題なし.

//index.ts
import fileUploader = require('./js/fileUploader');
//↑index.tsからだとrequire('./fileUploader')なのでエラー。

↑node-webkitのJavaScript Context(いわゆるブラウザの世界)でrequireをした場合、JavaScriptファイルからのパスではなく、そのJavaScriptを読み込んでいるhtmlからのパスになる。

参考:

回避策1

その場しのぎ的。requireをindex.htmlのインラインに持ってくる。

<!-- index.html -->
<!DOCTYPE html>
<html>
  <head >
    <meta charset="utf-8" />
    .................
    <script>
      //..................
       var fileUploader = require('./js/fileUploader');
      //................. 
    </script>
    <script src="
  </body>
</html>

回避策2

構造を変える

  • index.html
  • index.js(index.ts)
  • js
    • fileUploader.js
<!-- index.html -->
<!DOCTYPE html>
<html>
  <head >
    <meta charset="utf-8" />
    .................
    <script src="index.js"></script>
  </body>
</html>

うーむ。