vite 中使用 html-minifier-terser

在Vite中使用html-minifier-terser插件可以对HTML进行压缩和优化。你可以在Vite的配置文件中添加以下代码来使用该插件：

const htmlMinifierPlugin = require('html-minifier-terser');

module.exports = {
  // 其他配置项...
  plugins: \[
    htmlMinifierPlugin({
      // 配置项...
    })
  \]
}

你可以根据需要配置html-minifier-terser插件的选项来进行定制化的压缩和优化。例如，你可以设置`collapseWhitespace`选项来移除HTML中的空白字符，或者设置`removeComments`选项来移除注释等。具体的配置项可以参考html-minifier-terser的文档。

引用\[1\]中的代码是使用SpeedMeasurePlugin来测量打包时间的插件，并使用smp.wrap方法包裹了导出的webpack配置。这样可以在控制台中看到每个插件的执行时间，以便进行性能优化。

引用\[2\]中的代码是使用PurgeCssPlugin来移除未使用的CSS样式的插件，并通过safelist属性来保留指定的HTML标签的样式。

引用\[3\]中提到了一些在代码中可能存在的问题，例如使用了ES6的语法、模块化语法和CommonJS的模块化语法，以及在通过script标签引入时需要添加type="module"属性。这些问题可能会导致在低版本浏览器上出现兼容性问题。
#### 引用[.reference_title]
- *1* *2* *3* [Webpack从入门到进阶（三）---附沿路学习案例代码](https://blog.csdn.net/wuyxinu/article/details/123221905)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^insertT0,239^v3^insert_chatgpt"}} ] [.reference_item]
[ .reference_list ]