Question

我正在使用具有以下结构的monorepo node.js项目：

rootDir
  packageA
  packageB
  packageC

我想使用webpack和babel.js生成一捆packageB代码。 packageA的出口很多，但是packageA仅使用一个出口，我们将其称为出口utils。

当我运行webpack时，它认识到packageB取决于packageA，因此webpack依赖关系图现在包括packageA在其{{1}中导出的所有模块尽管实际上只需要一个。因此，index.js中的所有模块都被babel.js进行转译，而babel.js甚至包括packageA中文件所包含的node_modules个软件包。使用babel.js编译packageA时遇到了很多问题。它们的范围包括babel.js无法处理非Javascript文件，其中某些模块的装载程序do not exist，webpack not finding在某些文件和许多其他文件中具有混合的esm和commonjs语法*。 >

其他问题只能通过注释node_modules导出的2个有问题的模块来解决。

如您所见，该解决方案并不理想，而且可能长期无法持续。有没有一种方法可以使Webpack转换packageA而不转换其packageA？尽管我进行了许多正则表达式尝试，但仍无法实现这一目标。以下是我的配置文件：

*我设法通过在babel配置中添加node_modules来解决此问题，但是这将禁用Webpack树摇动机制，这意味着我需要为我的项目使用单独的modules: "commonjs"。

webpack.config.js

babelrc

babel.config.js

const path = require('path')
const webpack = require('webpack')

module.exports = {
  mode: 'development',
  target: 'node',
  entry: './src/index.js',
  output: {
    filename: 'bundle.js',
    path: path.resolve(__dirname, 'build')
  },
  devtool: 'source-map',
  plugins: [
    new webpack.IgnorePlugin(/^(hiredis|transifex)$/)
  ],
  module: {
    rules: [
      {
        test: /node_modules\/datauri\/index\.js$/,
        loaders: ['shebang-loader', 'babel-loader']
      },
      {
        test: /node_modules\/needle\/lib\/needle\.js$/,
        loaders: ['file-loader', 'babel-loader']
      },
      {
        test: /\.js?$/,
        use: {
          loader: 'babel-loader',
          options: {
            rootMode: 'upward'
          }
        },
        include: [
          path.resolve(__dirname, 'src'),
        "/path/to/packageA",
        "/path/to/packageC",
        ]
      }
    ]
  }
}

更新：我只是注意到我并没有忽略babel.config.js中的module.exports = { plugins: [ [ '@babel/plugin-proposal-decorators', { legacy: true } ], '@babel/plugin-syntax-dynamic-import', '@babel/plugin-syntax-import-meta', '@babel/plugin-proposal-class-properties', '@babel/plugin-proposal-json-strings', '@babel/plugin-proposal-function-sent', '@babel/plugin-proposal-export-namespace-from', '@babel/plugin-proposal-numeric-separator', '@babel/plugin-proposal-throw-expressions', '@babel/plugin-proposal-export-default-from', '@babel/plugin-proposal-logical-assignment-operators', '@babel/plugin-proposal-optional-chaining', [ '@babel/plugin-proposal-pipeline-operator', { proposal: 'minimal' } ], '@babel/plugin-proposal-nullish-coalescing-operator', '@babel/plugin-proposal-do-expressions', '@babel/plugin-proposal-function-bind' ], presets: [ [ '@babel/preset-env', { targets: { node: 'current' }, corejs: 3, useBuiltIns: 'usage', modules: "commonjs" } ], '@babel/preset-typescript' ], env: { debug: { sourceMaps: 'inline', retainLines: true } } }，所以我添加了：

node_modules

到我的babel.config.js。这样我就可以停止使用ignore: [ /node_modules/ ]了，所以我想这确实起到了一定的作用，但是在尝试运行包时仍然出现错误，例如，由于编译modules: 'commonjs'而导致的错误，例如此error。

如何在webpack中仅包含特定模块而不转换其依赖项？

0 个答案: