尝试使用 Webpack 构建 AMD 模块 — 出现“无法解析模块‘导出’”错误

Question

我试图在一个使用 AMD 模块和 Require.js 的项目中引入 Webpack。项目结构的相关部分是这样的：

\n\n

\n\n

（即项目根文件夹包含一个js包含所有应用程序脚本的文件夹，其入口点是 main.js，还有一个tools包含npm_modules我正在构建的 gulp 任务的文件夹）

\n\n

npm_modules（是的，我知道在项目的根目录中使用和会更简单gulpfile，但这就是我所拥有的结构）

\n\n

所以我试图从应用程序划分的 AMD 模块中构建一个 js 包。为了简化起见，让 \xe2\x80\x99s 说 main.js 文件具有以下代码：

\n\n

define([\n    \'jquery\'\n], function (\n    $\n) {\n    \'use strict\';\n\n    console.log($);\n});\n

\n\n

这意味着我需要jquery从./js/libs/vendor/jquery/dist/jquery.js

\n\n

这是webpack.js我编写的 webpack 配置（树形图上的文件）：

\n\n

var path = require(\'path\');\n\nvar appModulesPath = path.resolve(\'../js\'); // gulpfile\xe2\x80\x99s process is run in ./tools folder\nvar nodeModulesPath = path.join(__dirname, \'..\', \'node_modules\');\nconsole.log(appModulesPath, \' and \', nodeModulesPath); // I confirm that paths are correct\n\nmodule.exports = {\n    context: path.join(__dirname, \'../../\'),\n    debug: false,\n    resolve: {\n        root: [appModulesPath, nodeModulesPath],\n        alias: {\n            \'jquery\': \'libs/vendors/jquery/dist/jquery\',\n        },\n        extensions: [\'.js\']\n    },\n    entry: [\'./js/main\'],\n    output: {\n        path: path.join(__dirname, \'../../js\'),\n        filename: \'bundle.js\'\n    },\n    module: {\n        loaders: [\n            {test: /jquery/, loader: \'exports?$\'},\n        ]\n    }\n};\n

\n\n

但是当我尝试运行该任务时，出现以下错误：

\n\n

ERROR in ../js/main.js\nModule not found: Error: Cannot resolve module \'exports\' in /path/to/project/root/folder/js\n @ ../js/main.js 1:0-9:2\n

\n\n

如果我正确理解错误，Webpack 会尝试使用exports-loader. 但我已经安装了它，并且它位于该node_modules文件夹中。是不是Webpack不知道去哪里找node_modules？但我正在解析配置中的根目录，当我注销传递给 的路径时resolve.root，它们是：/path/to/project/root/js和/path/to/project/root/tools/node_modules。为什么\xe2\x80\x99t Webpack 不支持exports-loader？

\n\n

我没主意了。能否请你帮忙？

\n

Answer 1

呸! 花半个小时描述问题，然后拼命寻找答案！:-)

解决方案是使用resolveLoader。

感谢Github 上的讨论。