Question

项目使用模块A.

此模块需要本地路径，例如require('./otherModule')。

如何让webpack从另一个目录解析此路径，如果不存在则回退到正常解析？

Answer 1

也可以像这样使用NormalModuleReplacementPlugin：

  plugins: [
    new webpack.NormalModuleReplacementPlugin(/^\.\/ReactCompositeComponent$/, 'ReactCompositeComponent'),
    new webpack.NormalModuleReplacementPlugin(/^\.\/ReactDOMComponent$/, 'ReactDOMComponent')
  ]

Answer 2

没有简单的方法来对require()之类的相对require('./otherModule').语句进行别名，我不建议这样做。它打破了文件路径的基本概念，可能会使其他程序员感到困惑。

根相对路径（推荐）

您可以使用＆＃34; root-relative＆＃34;路径。这些路径以/开头。然后你可以编写像require("/app/controller/otherModule.js")这样的require语句。您只需告诉webpack root所在的位置：

// webpack.config.js

module.exports = {
    ...
    resolve: {
        root: "/absolute/path/to/your/folder"
    }
    ...
};

您还可以提供一系列root的路径。

解析器插件（不推荐）

但是，如果你真的需要为这些路径添加别名，你可以挂钩webpack的解析机制。 Webpack为插件提供了广泛的API来改变其行为。重写所有相对路径的插件将如下所示：

// webpack.config.js

var myWebpackPlugin = {
    apply: function (compiler) {
        compiler.resolvers.normal.apply(myResolverPlugin)
    }
};

var myResolverPlugin = {
    apply: function (resolver) {
        resolver.plugin("resolve", function (context, request) {
            if (request.path[0] === ".") {
                request.path = path.resolve(__dirname,
                    "whatever", "you", "like", request.path);
            }
        });
    }
}

module.exports = {
    ...
    plugins: [
        myWebpackPlugin
    ]
};

如何使用webpack将自治路径的相对路径别名？

2 个答案:

根相对路径（推荐）

解析器插件（不推荐）