6
4

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

JavaScriptをES6で書く環境を作る(Windows + WebStorm + Babel 編)

Last updated at Posted at 2016-11-01

WebStormでES6仕様で記述したJavaScriptファイルを作成した際、

File watcher 'Babel' is available for this file. Description: 'Transpiles ECMAScript 6 code to ECMAScript 5'
warning.png

などと表示された場合の、Windows環境での対応です。

Mac環境ではhkusuさんが
ES6 で書く環境を作る(WebStorm + Babel 編)
で書かれてますのでそちらを。

Windowsでもほとんどかわりませんが一応メモとして残します。

#前提環境

OS:Windows7
Babel:6.5.2
WebStorm:2016.2.1
npm:3.10.3

#手順
Babel(cli)をグローバルインストール
npm install babel-cli -g

WebStormのメニューバーから[File]-[Settings...]を選択。

表示されたダイアログの左側部分で[Tools]-[File Watchers]を選択し、ダイアログ右上の「+」ボタンを押して[Babel]を選択。
file_watcher.png

さらに表示されたダイアログで、私の場合はそのままで[OK]ボタンを押して完了でした。
new_file_watcher.png

[Program]の部分が指定されていなければ、
C:\Users\[ユーザ名]\AppData\Roaming\npm\babel.cmd
を指定すればよいと思います。

6
4
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
6
4

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?