Question

我已经阅读了part of the Webpack documentation，它解释了为什么Webpack在使用module.loaders语法设置加载器时会缩小HTML。但我无法找到解释如何阻止这一点的任何地方。我正在使用pug-loader和html-webpack-plugin来处理我的模板，但是Webpack总是在缩小HTML的情况下将它们吐出来。

我该怎么办？

{
  test: /\.pug$/,
  use: 'pug-loader'
}

new HtmlWebpackPlugin({
  title: 'Home',
  filename: 'index.html',
  template: './src/index.pug',
  inject: 'head',
  chunks: ['app'],
  hash: true
}),

Answer 1

This issue可能对您有帮助。

loaders: [
    {
      test: /\.pug$/,
      exclude: /(node_modules)/,
      loader: "pug-html",
      query: {
        pretty: true
      }
    }
  ]

Answer 2

以下命令适用于npm run dev和npm run prod

    module: {
        rules: [{
            test: /\.pug$/,
            use: [
                'html-loader?minimize=false', 
                'pug-html-loader?pretty=true'
            ]
        }]
    },

Answer 3

html-webpack-plugin有一个选项。 if (type == 1) if (line.StartsWith(user.PadRight(FieldLengths1[0]))) keep = true; else if (type == 2) if (line.StartsWith(user.PadRight(FieldLengths2[0]))) keep = true;。你试过添加吗？

https://github.com/jantimon/html-webpack-plugin#configuration

Answer 4

这对我有用：

rules: [{
    test: /\.pug$/,
    use: [
        {
           loader: 'html-loader',
           options: {
                minimize: false
           }
        },
        {
            loader: 'pug-html-loader',
            options: {
                pretty: true
            }
        }
    ],
}],

如何阻止Webpack缩小HTML？

4 个答案: