PCがあれば何でもできる!

へっぽこアラサープログラマーが、覚えたての知識を得意げにお届けします

【TypeScript】target:'es6'でビルド後、実行すると"TypeError: ??? is not a function"が出る

f:id:m_doi2:20160309162719p:plain

TypeScriptでasync/awaitが使いたかったため、こちらの記事を参考にさせていただき、ビルド環境を整えました。

TypeScript 1.7 を Babel と組み合わせて async/await を使う | スマホ神 – JavaScript 受託開発 –

環境

  • Node v5.6.0
  • typescript v1.8.7

ビルド設定

参考にさせていただいた記事そのまま。

// gulpfile.js

const gulp = require('gulp');
const babel = require('gulp-babel');
const sourcemaps = require('gulp-sourcemaps');
const typescript = require('gulp-typescript');

gulp.task('default', () => gulp
    .src(['src/**/*.ts'])
    .pipe(sourcemaps.init())
    .pipe(typescript({ target: 'es6' }))
    .pipe(babel({ presets: ['stage-3', 'es2015'] }))
    .pipe(sourcemaps.write({ sourceRoot: 'src' }))
    .pipe(gulp.dest('lib')));

ビルドしたソース

async/awaitでexpressサーバーを起動。

// app.ts

/// <reference path="./typings/express/express.d.ts" />
'use strict';

import 'babel-polyfill';
import * as express from 'express';

(async () => {
  try {
    const app = express();
    const server = await Promise.resolve(app.listen(8080));
    console.log(`Started on port ${server.address().port}`);
  } catch(err) {
    console.error(err.stack);
    throw err;
  }
})();

エラー内容

ビルドは問題なく通るが、node app.jsで実行後、TypeError: express is not a functionが発生。

express以外でも、インポートしたものを関数として実行するタイプだと同様のエラーが発生。

原因

module: 'commonjs'の指定漏れ。

// gulpfile.js

const gulp = require('gulp');
const babel = require('gulp-babel');
const sourcemaps = require('gulp-sourcemaps');
const typescript = require('gulp-typescript');

gulp.task('default', () => gulp
    .src(['src/**/*.ts'])
    .pipe(sourcemaps.init())
    //.pipe(typescript({ target: 'es6' }))
    .pipe(typescript({ target: 'es6', module: 'commonjs' })) // ←module追加
    .pipe(babel({ presets: ['stage-3', 'es2015'] }))
    .pipe(sourcemaps.write({ sourceRoot: 'src' }))
    .pipe(gulp.dest('lib')));

本当に初歩的過ぎて、調べても全然出てこなかったので、記載しておきます^^;