Question

我有一个非常大的项目，它使用两个webpack包来支持更新版本的网站。一个配置使用raw-loader来处理html文件。它看起来像这样：

this.configModern = {
  entry: 'modern',
  output: {
    filename: 'bundled-[name].[chunkhash].js',
    path: path.join(__dirname, '/Scripts/bundled/')
  },
  module: {
    rules: [
        {
            test: /\.html$/,
            use: [
                'raw-loader'
            ]
        },
    ]
  },
  plugins: [
    new CommonsChunkPlugin({
      name: 'vendor-modern',
      minChunks: function (module) {
        return module.context
          && module.context.includes('node_modules');
      }
    }),
    new webpack.ProvidePlugin({
      'window.jQuery': 'jquery'
    }),
    new HtmlWebpackPlugin({
      filename: 'bundle_modern_dev.html',
      template: './Views/Shared/WebpackTemplates/devTemplate.html',
      inject: false,
    }),
  ],
};

这是我的devTemplate.html

<% for (var js in htmlWebpackPlugin.files.js) { %>
<script src="/Scripts/bundled/<%= htmlWebpackPlugin.files.js[js] %>"></script>
<% } %>

我的问题是raw-loader导致webpack将devTemplate.html的内容复制到输出文件。

如何排除模板文件，使其使用html-webpack-plugin的默认ejs加载程序，并且不使用raw-loader。

编辑：

webpack是版本2.3.1

html-webpack-plugin是版本3.2.0

Answer 1

我们可以在Webpack中排除文件或文件夹

module: {
    rules: [
        {
            test: /\.html$/,
            exclude:/WebpackTemplates/,   /* Add this line */
            use: [
                'raw-loader'
            ]
        },
    ]
  },

我将包含模板的文件夹（WebpackTemplates）添加到raw-loader的排除选项

这意味着它将忽略该文件夹中的所有文件。

您可以使用正则表达式添加多个文件夹/文件夹以排除选项。

如何从webpack中的raw-loader中排除html-webpack-plugin模板

编辑：

1 个答案: