【TypeScript】target:'es6'でビルド後、実行すると"TypeError: ??? is not a function"が出る
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')));
本当に初歩的過ぎて、調べても全然出てこなかったので、記載しておきます^^;