使用Parcel构建项目时出现不支持的.html文件类型报错如何解决？

你遇到的报错是Parcel v2的默认构建目标识别逻辑导致的，可按以下两种方案处理，按需选择即可：

方案1：保留main字段（推荐） #

在你的package.json中新增source字段指定项目入口，同时添加targets配置关闭Parcel对main字段的构建目标识别：

{
  "name": "myflix-client",
  "version": "1.0.0",
  "main": "src/index.html",
  // 新增以下配置
  "source": "src/index.html",
  "targets": {
    "main": false
  },
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    // 也可以顺便把启动命令写到scripts里，后续直接跑npm run dev即可
    "dev": "parcel",
    "build": "parcel build"
  }
}

配置完成后重新运行parcel src/index.html即可正常构建。

方案2：删除main字段 #

如果选择移除main字段，需要先清理Parcel缓存避免旧配置干扰，操作步骤如下：

• 删除package.json中的"main": "src/index.html"行
• 运行以下命令清理缓存和历史构建产物：

  npx parcel clean
  # 如果上面的命令执行失败，手动删除项目根目录下的 .parcel-cache 文件夹和 dist 文件夹即可
  

• 重新执行parcel src/index.html启动构建

补充说明：main字段本身是NPM规范中用于标识JS库入口的字段，前端应用项目不需要此字段，仅当你需要把当前项目发布为NPM包时才有保留的必要。

内容的提问来源于stack exchange，提问作者Jop