Posted at

Babel、ESLintが変換・検証してくれないのはシンボリックリンクが原因だった

More than 1 year has passed since last update.


結論

JavaScriptファイルをシンボリックリンクで呼び出している場合は、リンク元のフォルダにも.babelrc.eslintrcを置く必要がある。


前提:ローカルに置いたファイルは変換してくれる

とりあえず動作確認をするために簡単なES2015形式のスクリプトを書いてみました。

const hoge = 'hoge';

下記のように変換されたのでインストール成功したと思ったのです。

var hoge = 'hoge';


Babel、ESLintが設定を無視する

テストは問題なかったので俺俺JSライブラリをimportしてみたらBabelは変換してくれないし、ESLintは設定を無視されました。


理由はシンボリックリンクだった

テストで使ったファイルを俺俺JSライブラリフォルダに置いてみました。このファイルはBabelもESLintも意図した動作をしてくれたものです。しかしBabel、ESLint共に意図した動作をしてくれません。どうやらシンボリックリンクについては設定が及ばないようです。

Twitterで教えてくれた親切な方がいました。ありがとうございます!


実態のある場所に .eslintrc ファイルがあれば OK です。



結論再び:シンボリックリンクフォルダの中にも設定ファイルを置く


設定はシンボリックリンクでもOK

設定ファイルは共通にしたいので、マスターをひとつ作ってシンボリックリンクを置けばOKです。

+ app.js

+ oreore_lib/ ← シンボリックリンク。実体は別の場所
+ hogehoge/
+ .eslintrc ←各フォルダに設定を置く。
+ .babelrc ←設定ファイルはシンボリックリンクでもOK
+ hoge.js
+ foo/
+ .eslintrc
+ .babelrc
+ bar.js


フルパスでフォルダを指定する

プリセットモジュールの場所をフルパスで指定する必要がありました。node_modules場所は環境によって異なります。自分はグローバルにインストールしたものを使っています。


.babelrc改変前

{

"presets": ["es2015"]
}


.babelrc改変後

{

"presets": ["/Users/dada/.nodebrew/current/lib/node_modules/babel-preset-es2015"]
}


意外と情報が無い

シンボリックリンクを使う人が少ないのか、検索してもこの情報が出てきませんでした(それとも常識なのか?)。

そんなわけで些細な情報ですが残しておきたいと思います。