babel-loaderプリセットの解決方法を設定する

Question

webpackでバンドルしようとしています。私は少し複雑な依存関係があります：いくつかのコンポーネントは、いくつかの/home/.../フォルダにある他のコンポーネントを必要とします。

コンポーネント（/home/.../far-away-components/base-component.jsファイル）：

import {base_component} from "base-component"; 
exports class MyComponent extends base_component { 
    ... 
} 

webpack.config.js：Couldn't find preset "react" relative to directory "/home/.../far-away-components"を：

var path = require("path"); 
module.exports = { 
    ... 
    module: { 
     loaders: [ 
      { 
       test: /\.(js)$/, 
       loader: "babel", 
       query: { 
        presets: ['react', 'es2015', "stage-0"] 
       } 
      } 
     ] 
    }, 
    resolve: { 
     alias: { 
      "base-component": "/home/.../far-away-components/base-component.js" 
    } 
}; 

問題はfar-away-componentsフォルダがnode_modulesが含まれていないと、私はエラーを取得するということです。

babel-loaderプリセットにはresolveを設定するにはどうすればよいですか？

Answer 1

ソリューションfrom github issue：

query: { 
    presets: [ 
    'babel-preset-es2015', 
    'babel-preset-react', 
    'babel-preset-stage-0', 
    ].map(require.resolve), 
} 

Answer 2

どのように実行し

npm init 

/home/.../far-away-componentsフォルダ内の

、 、あなたが必要なものをインストールするには、NPMを使用について。

Answer 3

@mqklin：ローダーで/ node_modules /を除外しなかったため、この回避策では「.map（require.resolve）」を使用する必要がありました。以下のフォーマットは動作します：

loaders: [ 
    { 
    test: [/\.js$/, /\.es6$/], 
    exclude: /node_modules/, 
    loader: 'babel-loader', 
    query: { 
     cacheDirectory: true, 
     presets: ['react', 'es2015'], 
    } 
    } 
]