Babel 7 で rollup-plugin-typescript と rollup-plugin-babel を同時に使おうとすると、babelがトランスパイルしてくれない
TL;DR
babelプラグインを呼び出すときに、{ extensions: ["ts"] }
を与える。
追記(2018/09/26 21:30)
ふとissueを見たら、20時間前くらいに似た問題が挙がって、同じ方法で解決してた。なぜ先に見なかったのか。
0. 実行環境
// package.json "devDependencies": { "@babel/core": "^7.1.0", "@babel/preset-env": "^7.1.0", "rollup-plugin-babel": "^4.0.3", "rollup-plugin-typescript": "^1.0.0", "tslib": "^1.9.3", "typescript": "^3.0.3" }
rollup: v0.66.2
1.やろうとしたこと
Rollupで
- TypeScript のトランスパイル
- Babel のトランスパイル
を一緒にやる。
2.やったこと
少し調べればすぐに rollup-plugin-typescript
と rollup-plugin-babel
の2つのプラグインが見つかるので、これを使う。*1
tsconfig.json
でターゲットを ES6
にすることに注意して:
// rollup.config.js import ts from "rollup-plugin-typescript" import babel from "rollup-plugin-babel" export default { input: './app.ts', output: { file: 'app.js', format: 'iife', name: 'app' }, plugins: [ ts(), babel() ] };
2-1. 結果
TypeScript のトランスパイルはされているが、Babelのトランスパイルがされていない。
3. 原因
デバッグ用に簡単なプラグインを書いて確かめた結果、rollup-plugin-babel
に渡ってくる id
が main.ts
のままであることがわかった。
rollup-plugin-babel
のソースコード(v4.0.3)を見ると、43行目から55行目にかけて:
const { exclude, extensions, externalHelpers, externalHelpersWhitelist, include, runtimeHelpers, ...babelOptions } = unpackOptions(options); const extensionRegExp = new RegExp(`(${extensions.map(escapeRegExpCharacters).join('|')})$`); const includeExcludeFilter = createFilter(include, exclude); const filter = id => extensionRegExp.test(id) && includeExcludeFilter(id);
とあり、unpackOptions
をさらに追いかけると、@babel/core
の DEFAULT_EXTENSIONS
を使っている。
これには ts
が含まれていないので、extensionRegExp.test(id)
によって filter
が false
を返し、スキップされてしまっている。
4. 対策
babelプラグインを呼び出すときに、{ extensions: ["ts"] }
を与える。
// rollup.config.js import ts from "rollup-plugin-typescript" import babel from "rollup-plugin-babel" export default { input: './app.ts', output: { file: 'app.js', format: 'iife', name: 'app' }, plugins: [ ts(), babel({ extensions: ["ts"] }) ] };
5. おわり
この extensions
という引数は特にドキュメントにも書いてないようだった。
実は .babelrc
で設定できるのかと思って試したけどダメだった。
今回はTypeScriptだったけど、たとえばCoffee Scriptでも似たような現象は起こりえると思う。
もっといい方法があるよ、とか、ここに書いてあるよ、とかあったら教えて下さい。
*1: rollup-plugin-typescript2 のほうが良いという話しもある
どうぶつの森
ここ1ヶ月くらい、「とびだせ どうぶつの森」をやってる。
どうぶつの森シリーズは、ゲームキューブの e+ に始まって、おいでよ どうぶつの森は死ぬほどやった。とびだせ!も、このためだけに3DSを買った。
はじめてから4年半が経って、プレイ時間は140時間くらい。途中で1年くらい放置してることもあって、あまりハマったとは言えない。
最近、また e+ を遊ぶ機会があって、感じたのが、シリーズが人気になって、良くも悪くも「わかりやすくなった」のだということ。
住民同士の尖った会話やブラックジョークはまったくと言っていいほどないし、そもそも、住民同士の会話もほとんど起こらない。
会話の内容も一辺倒になって、魚を取ってきて、フルーツを取ってきて、家具を持ってきて、遊びに来て、遊びにいかせて、がほとんど。
なんというか、話しかける楽しみがない。
まあ「NPCと会話を楽しむ」って要素はもうウケないのか。わざわざNPCなんかと話さずとも、インターネット経由でPCと遊べるのだから、当たり前の進化なのかもしれない。
この有様だから、ポケットキャンプもハマれなかったし、おそらく、今後の作品も似た感じで楽しめないのだと思う。
最近のゲームはソーシャルソーシャルしててよくわからない。じじいになってしまったようだ。