如何从Webpack捆绑目录中排除目录？

Question

预期：

当我使用webpack进行构建时，除我的Webpack.config.js设置中的./src/Portfolio目录中的文件外，我的所有JS文件都被捆绑了。

实际：

尽管我在webpack.config.js中提供了设置和其他变体，但是Webpack捆绑了所有文件，包括目录中的文件。

代码：

Webpack.config.js

const path = require('path');

module.exports = {
  entry: './src/index.js',
  devtool: 'source-map',
  mode: 'development',
  module: {
    rules: [
      {
        test: /\.js$/,
        exclude: [
          path.resolve(__dirname, './src/Portfolio/')
        ]
      }
    ]
  },
  output: {
    filename: 'main.js',
    path: path.resolve(__dirname, 'dist')
  }
};

输出：

  

我如何成功排除./src/Portfolio目录及其目录   内容？

Answer 1

根据文件夹结构的外观，您没有为它提供排除的正确目录位置。我认为类似的方法应该可以，但是如果不能，请共享您的文件夹结构。

const path = require('path');

module.exports = {
  entry: './src/index.js',
  devtool: 'source-map',
  mode: 'development',
  module: {
    rules: [
      {
        test: /\.js$/,
        exclude: [
          './src/Portfolio/'
        ]
      }
    ]
  },
  output: {
    filename: 'main.js',
    path: path.resolve(__dirname, 'dist')
  }
};

Answer 2

我知道 op 正在使用 javascript，仅供参考，使用带有 webpack 的 typescript 可能会发生类似的问题。

在这种情况下，可以将排除的目录添加到 tsconfig.json 而不是 webpack.config.js，

//tsconfig.json

{
    "compilerOptions": {
        ...
    },
    "exclude": [
        "./src/Portfolio/",
    ]
}