如何使用Parcel运行index.html并解决@parcel/transformer-vue依赖冲突错误

这个报错是由于Parcel核心版本和对应Transformer插件版本不匹配导致的，Parcel 2对同系列插件的版本一致性要求极高，混用beta版和正式版、不同插件版本号不一致都会触发依赖冲突。

解决步骤如下：

• 删除现有依赖、缓存和版本锁定文件
  执行对应命令：
  • macOS/Linux环境：
    rm -rf node_modules .parcel-cache package-lock.json yarn.lock
  • Windows环境：
    先执行rmdir /s /q node_modules .parcel-cache，再手动删除项目根目录下的package-lock.json或yarn.lock文件
• 统一所有Parcel相关依赖的版本
  打开package.json文件，将所有@parcel/开头的依赖版本调整为同一个稳定正式版，不要混用beta版，示例修改：

  "@parcel/transformer-sass": "^2.12.0",
  "@parcel/transformer-vue": "^2.12.0",
  

• 重新安装依赖
  使用npm执行：npm install
  使用yarn执行：yarn install
• 重启项目
  直接执行parcel index.html即可正常启动。

额外注意：如果操作后仍有报错，可先全局卸载旧版本Parcel：npm uninstall -g parcel-bundler，优先使用项目局部安装的Parcel启动，可在package.json的scripts中添加配置 "dev": "parcel index.html"，后续通过npm run dev启动项目即可。

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