Less プラグインを使用すると、ファイルを保存するたびに、すばらしい Less -> Css コンパイルを取得できます。ES6 コードを ES5 にトランスパイルするために、Babel で同じ動作を得るにはどうすればよいですか? ありがとう
1 に答える
@lukas-kabrtの提案後に編集:
less2css
Sublime プラグインは、Sublime API の on_post_save() イベントを利用して、ファイルの保存をリッスンし、.less ファイルを自動的にコンパイルするコードをトリガーします。プラグインでこのイベントを使用し、Babel を使用して現在のファイルを自動コンパイルする外部コマンドにリンクすることにより、Babel ES6 から ES5 へのコンパイルでも同様のことが実現できます。これは Python で書かれた ST2 用のシンプルなプラグインで、これを実現します。
import sublime, sublime_plugin,os
from os.path import dirname, realpath
class BuildonSave(sublime_plugin.EventListener):
def on_post_save(self, view):
es6File = view.file_name()
filename, file_extension = os.path.splitext(es6File)
if file_extension == ".es6":
view.window().run_command('exec',{'cmd': ["/usr/local/bin/babel", es6File, "-o", filename+".js", "--source-maps", "inline"] })
注: このプラグインは .es6 サフィックスの付いたファイルを探し、それらを適切な .js ファイルにコンパイルします。たとえば、myfile.es6 は ES5 の myfile.js ファイルにトランスパイルされます。
Mac OS X を使用している場合は、端末でコマンドを実行することにより、システム上のcmd
場所/usr/local/bin/babel
を取得できます。which babel
ソースコードもここにあります: https://gist.github.com/kostasx/1d55c62edcee88375fc8
上記のコードをもう少し使いたい場合は、Sublime Plugin API ドキュメントをチェックアウトできます。