Help us understand the problem. What is going on with this article?

Webpackで名前にハイフンを含むモジュールをimportする

どうすればいいか

ケバブケースの名前をキャメルケースに書き換える。

例:
moment-duration-formatというモジュール名なら
import momentDurationFormat from 'moment-duration-format'

と書く。

何がしたかったのか

Webpackを使ってJavaScriptをクライアントサイドで実行している環境で、moment-duration-formatという、時間(期間)の表示を簡単にするライブラリ(Nodeモジュール)を導入したかった。

webpackを使っているので、ES Moduleスタイルで
import moment-duration-format from 'import-duration-format'と書いた。

どんな問題が起きたか

moment-duration-formatは時間を扱うライブラリであるmomentを拡張するライブラリであるためimport部は以下のようになるが

index.js
import moment 'import-duration-format'
import moment-duration-format from 'import-duration-format'

javascriptでは-が算術演算子として予約済みなせいか、momentが一つのシンボルとして認識されてしまう。

なぜかVSCodeの画面では import ... =' can only be used in a .ts file. というエラーメッセージとなっている。
EditableProgram_js_—_gachi-taite-designer-web.png

ブラウザ上のJavaScriptコンソールではModule parse failed: Identifier 'moment' has already been declared と上の行でmoment本体をimportしていることと関連したエラーメッセージとなっていた。
Developer_Tools_-_Vivaldi.png

なおmomentのimportをコメントアウトした場合のエラーメッセージとしては Module parse failed: Unexpected tokenとなり、import文の途中で算術演算子が登場することを怒られるようだ。
Developer_Tools_-_Vivaldi2.png

Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
No comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
ユーザーは見つかりませんでした