学习vue3时的 Bug日记

 2024-2-7

控制台报错，原来是我把https写成了hhttps，多了一个h，害得我弄了半天

const response12 = await axios.post(
      "https://test-api.psaudit.cn/api/template",

2024-2-19

很奇怪，打包后的文件，双击打开index.html文件，cookie保存不了
唉

退而求其次，使用本地存储

localStorage.setItem();

2024-2-19

报错Error: SyntaxError: Unexpected end of JSON input 【无法被正确解析为JSON格式】

【最后发现是还没有这个东西（它在函数里，此时我还没调用函数），就已经在（函数外）使用它】
最后发现，先定义函数，再使用函数的结果，最后使用onMounted来调用函数
这种做法是错误的，应该定义函数，再调用函数，最后使用函数的结果

2024-3-3

Error: error:0308010C:digital envelope routines::unsupported

解决方法：

"build:prod": "SET NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service build"

2024-3-3

打包后，打包后，双击dist目录中的index.html没有显示

原来是index.html里面使用了，绝对引用，得把dist里面的文件放在根目录下【如E盘】才能正常显示页面
修改了vue.config.js里面的

module.exports = {    publicPath: './',    }

就好了
publicPath: './'    是相对
publicPath: './'    是绝对

2024-3-6

main.ts:34 [Vue warn]: Component inside <Transition> renders non-element root node that cannot be animated. 

这个警告是因为在<Transition>组件内部渲染了一个非元素根节点，而这种节点无法进行动画处理。通常，Vue的过渡效果需要在组件内部包裹一个元素，而不是直接渲染非元素节点
解决方法：template里面套一个大的div，在大div里面写其它的内容

<template>
  <div>
  </div>
</template>