将webpack和babel与父项目目录中的文件一起使用

Using webpack and babel with files from parent project directory

本文关键字：文件 一起 webpack babel 项目      更新时间：2023-09-26

我有一个这样设置的项目，我正试图从file-b.js中请求file-a.js。

project-name/
  node_modules/
  src/
    file-a.js
  tools/
    tool-name/
      node_modules/
      src/
        file-b.js
      webpack.config.js
      package.json
  package.json

我的webpack 1.13.0配置一直有效，直到我添加了babel-loader 6.2.4和babel-preset-es2015 6.6.0。然后我开始收到错误消息。

/home/dan/dev/dan/project-name/src/file-a.js中存在错误模块构建失败：错误：找不到相对于目录"/home/dan/dev/dan/project-name/src"的预设"es2015"

现在我有一种预感，这是因为它在上面的package.json中寻找babel-preset-es2015。我可以通过在该级别安装它来消除这个错误，但随后我收到了一条关于babel模块不在那里的类似消息。

我尝试了各种方法，将上层src目录符号链接到内部项目中，使用resolve.root和resolve.alias尝试手动解析没有嵌套路径的文件夹。使用context将项目根设置为外部文件夹，但它仍然拾取了错误的node_modules。

如何强制webpack使用正确的node_modules文件夹？

默认情况下，webpack在./node_modules、../node_modules和../../node_modules中查找。

要强制它只使用特定目录，可以在resolve部分为模块modulesDirectories属性设置一个绝对路径：

module.exports = {
  // ...
  resolve: {
     modulesDirectories: [path.join(__dirname, 'node_modules')]
  }
}

webpack文档中有关moduleDirectories的更多详细信息

相关文章：