Vue 打包 ERROR TypeError: Cannot read property ‘tapPromise‘ of undefined

在前端vue打包升级的时候,遇到

Building for production... ERROR  TypeError: Cannot read property 'tapPromise' of undefined

报错时,具体报错如下:
附图
之前打包发版都是正常的,这边查看代码提交记录,在使用 compression-webpack-plugin 插件时尽然对版本进行变更,安装插件的时候默认最新版本,但是可能脚手架还不支持这个版本,所以需要降低插件版本进行使用,这边在安装的时候最新版本为 v9.2.0,降到 v6.1.1 进行使用;

npm install compression-webpack-plugin@6.1.1

重新打包正常!如下:



/  Building for production...Browserslist: caniuse-lite is outdated. Please run:
  npx browserslist@latest --update-db
  Why you should do it regularly: https://github.com/browserslist/browserslist#browsers-data-updating
\  Building for production...Browserslist: caniuse-lite is outdated. Please run:
  npx browserslist@latest --update-db
  Why you should do it regularly: https://github.com/browserslist/browserslist#browsers-data-updating
/  Building for production...Browserslist: caniuse-lite is outdated. Please run:
  npx browserslist@latest --update-db
  Why you should do it regularly: https://github.com/browserslist/browserslist#browsers-data-updating
/  Building for production...Browserslist: caniuse-lite is outdated. Please run:
  npx browserslist@latest --update-db
  Why you should do it regularly: https://github.com/browserslist/browserslist#browsers-data-updating
-  Building for production...Browserslist: caniuse-lite is outdated. Please run:
  npx browserslist@latest --update-db
  Why you should do it regularly: https://github.com/browserslist/browserslist#browsers-data-updating
/  Building for production...Browserslist: caniuse-lite is outdated. Please run:
  npx browserslist@latest --update-db
  Why you should do it regularly: https://github.com/browserslist/browserslist#browsers-data-updating
\  Building for production...Browserslist: caniuse-lite is outdated. Please run:
  npx browserslist@latest --update-db
  Why you should do it regularly: https://github.com/browserslist/browserslist#browsers-data-updating
|  Building for production...Browserslist: caniuse-lite is outdated. Please run:
  npx browserslist@latest --update-db
  Why you should do it regularly: https://github.com/browserslist/browserslist#browsers-data-updating
\  Building for production...[BABEL] Note: The code generator has deoptimised the styling of D:\WWW\landscape\src\honeypot\extend\qunee\lib\qunee-es.js as it exceeds the max of 500KB.
/  Building for production...

 WARNING  Compiled with 2 warnings                                                                                                              上午11:46:03

 warning 

asset size limit: The following asset(s) exceed the recommended size limit (244 KiB).
This can impact web performance.
Assets:
  static/img/world.c29637be.jpg (1.25 MiB)
  static/img/starfield.aeaf4baf.jpg (901 KiB)
  static/js/chunk-2f61e7ff.7e3c537f.js (377 KiB)
  static/js/chunk-43995616.30b14b68.js (1.26 MiB)
  static/js/chunk-46e1fe8a.d9dd5660.js (345 KiB)
  static/js/chunk-71e299c5.909d35a8.js (739 KiB)
  static/js/chunk-vendors.56e14876.js (3.41 MiB)
  assets/pisa.hdr (356 KiB)
  assets/flights.json (729 KiB)
  assets/starfield.jpg (901 KiB)
  assets/world.jpg (1.25 MiB)
  static/js/chunk-43995616.30b14b68.js.gz (448 KiB)
  static/js/chunk-vendors.56e14876.js.gz (607 KiB)

 warning 

entrypoint size limit: The following entrypoint(s) combined asset size exceeds the recommended limit (244 KiB). This can impact web performance.
Entrypoints:
  honeypot (3.65 MiB)
      static/css/chunk-vendors.5dea96f6.css
      static/js/chunk-vendors.56e14876.js
      static/css/honeypot.1b12b6ca.css
      static/js/honeypot.ace26f5c.js


  File                                      Size             Gzipped

  dist\honeypot\static\js\chunk-vendors.    3489.10 KiB      613.42 KiB
  56e14876.js
  dist\honeypot\static\js\chunk-43995616    1291.60 KiB      448.78 KiB
  .30b14b68.js
  dist\honeypot\static\js\chunk-71e299c5    738.58 KiB       239.19 KiB
  .909d35a8.js
  dist\honeypot\static\js\chunk-2f61e7ff    377.01 KiB       131.85 KiB
  .7e3c537f.js
  dist\honeypot\static\js\chunk-46e1fe8a    344.51 KiB       102.67 KiB
  .d9dd5660.js
  dist\honeypot\static\js\chunk-789f023a    125.67 KiB       42.43 KiB
  .00cdf017.js
  dist\honeypot\static\js\chunk-3dd330e8    83.82 KiB        28.97 KiB
  .b69b6624.js
  dist\honeypot\static\js\chunk-54973eec    23.57 KiB        5.76 KiB
  .c6ea81f4.js
  dist\honeypot\static\js\honeypot.ace26    18.79 KiB        5.97 KiB
  f5c.js
  dist\honeypot\static\js\chunk-61f5c6af    16.69 KiB        6.96 KiB
  .aada27b3.js
  dist\honeypot\static\js\chunk-74895916    12.63 KiB        3.86 KiB
  .5d447c2b.js
  dist\honeypot\static\js\chunk-c968ee44    9.01 KiB         2.88 KiB
  .ddb03a70.js
  dist\honeypot\static\js\chunk-786cd56d    8.75 KiB         3.97 KiB
  .85359f70.js
  dist\honeypot\static\js\chunk-05ed3ce3    8.38 KiB         3.31 KiB
  .b01aa913.js
  dist\honeypot\static\js\chunk-1dde050a    8.30 KiB         2.91 KiB
  .baee40f4.js
  dist\honeypot\static\js\chunk-c3ce982a    8.09 KiB         2.63 KiB
  .7cc22f91.js
  dist\honeypot\static\js\chunk-37f4e2e1    5.13 KiB         1.75 KiB
  .3af4b854.js
  dist\honeypot\static\js\chunk-15caeab7    4.26 KiB         1.53 KiB
  .b8bf2687.js
  dist\honeypot\static\js\chunk-33cde2b4    3.92 KiB         1.47 KiB
  .8c01f495.js
  dist\honeypot\static\js\chunk-8e8365d4    3.72 KiB         1.49 KiB
  .3dee2f77.js
  dist\honeypot\static\js\chunk-626f08c0    2.57 KiB         1.01 KiB
  .7c61b793.js
  dist\honeypot\static\js\chunk-caa2700e    2.43 KiB         1.10 KiB
  .d592f96b.js
  dist\honeypot\static\css\chunk-vendors    234.16 KiB       35.49 KiB
  .5dea96f6.css
  dist\honeypot\static\css\chunk-789f023    12.10 KiB        2.95 KiB
  a.ffa9d9bf.css
  dist\honeypot\static\css\chunk-c968ee4    2.86 KiB         0.83 KiB
  4.ac4f6ec8.css
  dist\honeypot\static\css\chunk-c3ce982    2.51 KiB         0.82 KiB
  a.019060f5.css
  dist\honeypot\static\css\chunk-05ed3ce    1.38 KiB         0.55 KiB
  3.d7b240a1.css
  dist\honeypot\static\css\chunk-caa2700    1.36 KiB         0.52 KiB
  e.178f4a64.css
  dist\honeypot\static\css\chunk-15caeab    1.17 KiB         0.49 KiB
  7.d962b99a.css
  dist\honeypot\static\css\chunk-54973ee    1.12 KiB         0.43 KiB
  c.02635914.css
  dist\honeypot\static\css\chunk-71e299c    1.01 KiB         0.45 KiB
  5.41d2d7ee.css
  dist\honeypot\static\css\chunk-1dde050    0.91 KiB         0.38 KiB
  a.2ace578f.css
  dist\honeypot\static\css\chunk-7489591    0.78 KiB         0.31 KiB
  6.aeea7280.css
  dist\honeypot\static\css\chunk-61f5c6a    0.57 KiB         0.25 KiB
  f.81d7ce83.css
  dist\honeypot\static\css\chunk-37f4e2e    0.54 KiB         0.26 KiB
  1.53ad8f3b.css
  dist\honeypot\static\css\chunk-8e8365d    0.48 KiB         0.26 KiB
  4.2b6b080d.css
  dist\honeypot\static\css\chunk-4399561    0.45 KiB         0.17 KiB
  6.388495d7.css
  dist\honeypot\static\css\chunk-786cd56    0.43 KiB         0.22 KiB
  d.523d4898.css
  dist\honeypot\static\css\honeypot.1b12    0.42 KiB         0.32 KiB
  b6ca.css
  dist\honeypot\static\css\chunk-33cde2b    0.23 KiB         0.15 KiB
  4.af6dcf94.css
  dist\honeypot\static\css\chunk-626f08c    0.23 KiB         0.15 KiB
  0.ce4b7be2.css

  Images and other types of assets omitted.

 DONE  Build complete. The dist\honeypot directory is ready to be deployed.
 INFO  Check out deployment instructions at https://cli.vuejs.org/guide/deployment.html

技术参考:https://www.yixzm.cn/blog/523953

  • 2
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
根据引用\[1\]中的信息,报错信息显示为"Syntax Error: TypeError: Cannot read property 'styles' of undefined"。这个错误通常是由于代码中的某个地方出现了错误,导致无法读取未定义的属性'styles'。根据引用\[3\]中的建议,我们应该仔细检查报错信息,并找到对应的代码位置来解决问题。 另外,根据引用\[2\]中的package.json文件内容,我们可以看到项目中使用了Vue框架和相关插件。可能的原因是在Vue组件中的某个地方出现了错误,导致无法正确读取'styles'属性。 为了解决这个问题,我们可以按照以下步骤进行操作: 1. 首先,检查报错信息中提到的文件和行号,找到对应的代码位置。 2. 然后,仔细检查该代码位置附近的代码,查看是否有语法错误、拼写错误或其他错误。 3. 如果有可能,可以尝试注释掉该代码段,然后重新运行项目,看是否还会出现相同的错误。这样可以确定该代码段是否是问题所在。 4. 如果以上步骤都没有解决问题,可以尝试更新相关的依赖包,特别是Vue和相关插件的版本。可以根据引用\[2\]中的package.json文件中的版本号来确定需要更新的依赖包。 5. 如果问题仍然存在,可以在开发者社区或相关论坛上寻求帮助,向其他开发者请教或分享你的问题,以获得更多的解决方案。 总之,根据报错信息和引用的内容,我们可以通过仔细检查代码和相关依赖包来解决"Syntax Error: TypeError: Cannot read property 'styles' of undefined"的问题。 #### 引用[.reference_title] - *1* [解决Syntax Error: TypeError: Cannot read property ‘styles‘ of undefined](https://blog.csdn.net/qq_44732146/article/details/131674785)[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^insert_down1,239^v3^insert_chatgpt"}} ] [.reference_item] - *2* [(plugin vue) TypeError: Cannot read property ‘styles‘ of undefined](https://blog.csdn.net/qq_34793381/article/details/125655370)[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^insert_down1,239^v3^insert_chatgpt"}} ] [.reference_item] - *3* [Error in nextTick: “TypeError: Cannot read property ‘style‘ of undefined“的报错原因之一及解决...](https://blog.csdn.net/Yukinoshita_kino/article/details/107717279)[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^insert_down1,239^v3^insert_chatgpt"}} ] [.reference_item] [ .reference_list ]

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Mr Xu Luka

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值