如何阻止Parcel自动清除控制台日志？

针对你遇到的Parcel开发模式下自动重载后清空控制台日志的问题，可通过以下两种方式解决：

方式一：修改启动命令，添加环境变量 #

在package.json的scripts字段中，给start命令加入环境变量来禁用日志清除行为：

适用于macOS/Linux系统： #

"scripts": {
  "start": "PARCEL_HMR_CLEAR_LOG=false parcel index.html",
  "build": "parcel build index.html"
}

适用于Windows系统： #

"scripts": {
  "start": "set PARCEL_HMR_CLEAR_LOG=false && parcel index.html",
  "build": "parcel build index.html"
}

方式二：添加Parcel配置（推荐） #

直接在package.json中新增parcel配置字段，通过配置项关闭热重载时的日志清除：

修改后的完整package.json如下：

{
  "name": "forkify",
  "version": "1.0.0",
  "description": "",
  "default": "index.html",
  "scripts": {
    "start": "parcel index.html",
    "build": "parcel build index.html"
  },
  "author": "",
  "license": "MIT",
  "devDependencies": {
    "@parcel/transformer-sass": "^2.7.0",
    "parcel": "^2.7.0"
  },
  "parcel": {
    "hmrOptions": {
      "clearLog": false
    }
  }
}

完成配置修改后，重新执行npm start，修改JS文件保存触发页面重载时，控制台的console.log输出就不会被清除了。

内容的提问来源于stack exchange，提问作者MinhSu - Justin