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：

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，我收到错误：Couldn't find preset "react" relative to directory "/home/.../far-away-components"。

如何为resolve预设设置babel-loader？

Answer 1

解决方案from github issue：

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

Answer 2

@mqklin：你需要使用这种解决方法，使用＆＃34; .map（require.resolve）＆＃34;，因为你没有在你的加载器中排除/ node_modules /。以下格式应该有效：

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

Answer 3

如何运行

npm init

在/home/.../far-away-components文件夹中，然后使用npm安装你需要的东西。

如何设置babel-loader预设的决心

3 个答案: