配置webpack，在script标签里添加defer属性

要在Webpack 4中为生成的打包文件的<script>标签添加defer属性，使用webpack插件ScriptExtHtmlWebpackPlugin。

以下是配置Webpack的步骤：

1. 安装插件：

npm install --save-dev script-ext-html-webpack-plugin

2. 在webpack配置文件中引入插件：

const ScriptExtHtmlWebpackPlugin = require('script-ext-html-webpack-plugin');

3. 在plugins数组中添加插件的实例：

plugins: [
  new ScriptExtHtmlWebpackPlugin({
    defaultAttribute: 'defer'
  })
]

现在，当你使用Webpack进行打包时，生成的HTML文件中的<script>标签将自动添加defer属性。

请注意，ScriptExtHtmlWebpackPlugin默认将defer属性应用于所有的<script>标签。如果你希望对某些特定的脚本标签排除defer属性，你可以在Webpack配置中进行额外的配置。例如：

plugins: [
  new ScriptExtHtmlWebpackPlugin({
    defaultAttribute: 'defer',
    custom: [
      {
        test: /\.js$/, // 匹配要排除的文件
        attribute: 'async' // 排除时使用的属性
      }
    ]
  })
]

上述配置将为所有.js文件添加defer属性，除非指定的文件（使用test属性进行匹配）将使用async属性。

希望这可以帮助你在Webpack 4中为生成的打包文件的<script>标签添加defer属性。