Question

我一直在尝试设置这个React + Relay示例（https://github.com/RGRjs/rgrjs.com），而我在解析babel-loader的webpack插件的路径时遇到了麻烦。当我在我的项目目录中运行webpack时，我得到了ReferenceError问题，我认为这是由webpack通过它试图构建的单个文件的上下文来解决插件依赖性引起的。

详细说明：我的项目结构为链接回购：

rgrjs:
├── data
|   ├── schema.js
|   └── header.html
├── js
|   ├── app.js
|   └── components
|    |   └── Main.js
├── public
|   └── bundle.js
babelRelayPlugin.js
webpack.config.js

并将webpack.config.js设置如下：

var projectRoot = process.env.PWD;
console.log('Project Rooted at ' + projectRoot);
module.exports = {
    context: projectRoot,
    entry: "./js/app.js",
    output: {
        path: __dirname + "/public",
        filename: "bundle.js"
    },
    resolveLoader: {
        root: projectRoot
    },

    module:{
        loaders: [
            {
                test:/\.js$/,
                exclude: /node_modules/,
                loader: 'babel-loader',
                babelrc: false,
                query: {
                    presets: ['react','es2015','stage-0'],
                    plugins: ['./babelRelayPlugin']
                }
            }
        ]
    }
};

当我尝试构建时，我收到以下错误：

./js/app.js中的错误模块构建失败：ReferenceError：未知插件“./babelRelayPlugin”在“base”中指定为0，尝试解析相对于“... / rgrjs / js”

引用的“babelRelayPlugin”位于根“rgrjs”目录中（相对于webpack应该是“./”。当我将插件路径定义切换为“../babelRelayPlugin”时，。/ js / app。 js解析参考但是我遇到了另一个问题：

./js/components/Main.js中的错误模块构建失败：ReferenceError：未知插件“../babelRelayPlugin”在“base”中指定为0，尝试解析相对于“... / rgrjs / js / components”

其他解决方案似乎建议使用resolve / resolveLoader / context，但它似乎对我不起作用，如配置文件中所示。我设置错了还是这是一个真正的错误？

最佳

Answer 1

这里的问题似乎是webpack将插件路径作为字符串传递，在不同文件的每个转换中重新评估，而路径本身需要定义为严格路径，如下所示： / p>

var projectRoot = process.env.PWD;
console.log('Project Rooted at ' + projectRoot);

var path = require('path');

module.exports = {
    //...
    module:{
        loaders: [
            {
                //...
                loader: 'babel-loader',
                query: {
                    presets: ['react','es2015','stage-0'],
                    plugins: [path.resolve(projectRoot,'babelRelayPlugin')]
                }
            }
        ]
    }
};

这似乎不一致地应用于不同的版本/版本，因为在不同的计算机上构建相同的配置文件和文件夹结构。

webpack / babel-loader由相对路径引起的ReferenceError

1 个答案: