web-dev-qa-db-ja.com

es6およびbabel-nodeを使用してルートディレクトリからノードモジュールをインポートする

Babel transpilerを使用して、es6でノードアプリを作成しています。

2つのファイルがありますindex.js＆my-module.jsルートディレクトリ

- index.js
- my-module.js

my-module.js

export let myFunc = () => {
  console.log('myFunc was called!!!');
}

index.js

import {myFunc} from './my-module';
myFunc();

コマンドラインから次の行を実行すると、すべてが正常に機能します。

$ babel-node index.js >> myFunc was called!!!

しかし、my-moduleをインポートするときにドットを削除すると：

import {myFunc} from '/my-module';
myFunc();

エラーが発生しています：

Error: Cannot find module '/my-module'

絶対パスを使用してモジュールをインポートできない理由は何ですか？とにかくそれをサポートするために.babelrcの設定を変更するには？

ありがとう

ecmascript-6babeljs
42
Gavriguy

（ほぼ）任意のツール「/ x」と同様に、ファイルシステムのルートにある「x」を意味します。 Babelは実際にはパスを確認せず、コンパイルするだけです

import {myFunc} from '/my-module';

に

var _myModule = require('/my-module');

そして、ノードは実際にモジュールを検索します。

プロジェクトのルートを基準にインポートしたい場合は、プラグインを使用できます。あまりあいまいでないものを使用することをお勧めします。コードを読んでいる次の人のためにこれを必ず文書化してください。

プロジェクトの相対を意味する先頭の~を使用する例を次に示します。好きなものを使用できます。 ^も良いでしょう。

入力例：

import {a} from '~my-module';
import {b} from '/my-module';
import {c} from './my-module';

scripts/babel-plugin-project-relative-require.js

module.exports = function (babel) {
  // get the working directory
  var cwd = process.cwd();

  return new babel.Transformer("babel-plugin-project-relative-require", {
    ImportDeclaration: function(node, parent) {
      // probably always true, but let's be safe
      if (!babel.types.isLiteral(node.source)) {
        return node;
      }

      var ref = node.source.value;

      // ensure a value, make sure it's not home relative e.g. ~/foo
      if (!ref || ref[0] !== '~' || ref[1] === '/') {
        return node;
      }

      node.source.value = cwd + '/' + node.source.value.slice(1);

      return node;
    }
  });
};

.babelrc

{
    "plugins": [
        "./scripts/babel-plugin-project-relative-require.js"
    ]
}

出力（/ tmpで実行する場合）：

'use strict';

var _tmpMyModule = require('/tmp/my-module');

var _myModule = require('/my-module');

var _myModule2 = require('./my-module');
56
Brigand

FakeRainBrigand/Gavriguyのソリューションは優れており、うまく機能します。そこで、npmで簡単にインストールでき、シンプルなBabelプラグインを使用できるプラグインを開発することにしました。

https://github.com/michaelzoidl/babel-root-import

お役に立てれば...

41
Michael J. Zoidl

まず第一に、BabelはES2015からES5構文への単なるトランスパイラーです。その仕事はこれを変換することです：

import {myFunc} from '/my-module'

これに：

var _myModule = require('/my-module');

Nodeが実行する必要のある実際のモジュール、およびNodeではどのように詳細を確認できますか： https://nodejs.org/api/modules.html#modules_file_modules

要約すると、./moduleは、ローカルディレクトリに相対的なモジュールへのパス、/moduleはモジュールへの絶対パス、moduleトリガーNodeはローカルnode_modulesディレクトリおよびすべて昇順。

8
vtambourine