notebook

都内でWEB系エンジニアやってます。

moment-rangeを使いたい

単純にmomentとmoment-rangeをimportしただけだとコンパイルが通らず使えないので対応する必要がありました

stackoverflowなどでこうしたらいいよって書いてあったのでやってみたがコンパイルエラーで通らない

使えるようになるまでにやったことのメモ

versionは4です

  • install
npm install --save moment moment-range @types/moment @types/moment-range
  • 参考

Typescript usage · Issue #120 · rotaready/moment-range

github.com

上記参考にしてextendmomentを使ってrangeを使えるようにしてみた

  • app.component.ts
import Moment from 'moment';
import {extendMoment} from 'moment-range';
const moment = extendMoment(Moment);

これでできるかと思ったができなかった

コンパイルできずにエラー

Module '"/home/vagrant/sandbox/ngx-sample/node_modules/moment/moment"' has no default export.

typescriptのimportの仕方に制限があるようでオプションを変えることで上記のコードでmoment-rangeが使えるようになるそう

"allowSyntheticDefaultImports": true,

このオプションをつけることでextendMomentがimportできるようになる

  • 参考

TypeScript の ES6 modules の解釈と allowSyntheticDefaultImports の整理 - Qiita

qiita.com

workarroundっぽいけど一旦はこれで使えます