Webpack-merge 不访问公共配置变量

Webpack-merge not accessing common configuration variables

据我了解,webpack-merge 帮助我们将 webpack.config 文件分解为更易于管理的块,添加与环境相关的配置。

While we will separate the production and development specific bits out, note that we'll still maintain a "common" configuration to keep things DRY. In order to merge these configurations together, we'll use a utility called webpack-merge. With the "common" configuration in place, we won't have to duplicate code within the environment-specific configurations.
- Webpack - production

我的 webpack.prod.js 中的代码是这样的:

const merge = require('webpack-merge');
const common = require('./webpack.common.js');

module.exports = merge(common, {
  mode: 'production',
  devtool: 'source-map',
  module: {
    rules: [
      {
        test: /\.(png|svg|jpg|gif)$/,
        use: [
            'file-loader'
        ],
        exclude: [
          path.resolve(__dirname, "node_modules") //NEED TO ACCCESS PATH VARIABLE HERE
        ]
      }
  ]
}

在我的 webpack.common.js 中是我认为 webpack.prod.js 可以访问的变量 path。我假设它没有,因为我遇到了错误:

ReferenceError: path is not defined

问题

如何访问常用配置?我是不是误解了webpack-merge的概念?

webpack-merge 将获取两个 js 对象并使用 lodash mergeWith 合并它们。所以基本上它返回一个包含两个对象属性的对象。

它无法为您提供 path 变量或任何其他变量。您需要将其隐式导入到 webpack.prod.js 文件中。