uni-app 3.4.11.20220520-alpha版CSS语言替换位置错误的Bug

uni-app 3.4.11.20220520-alpha版CSS语言替换位置错误的Bug

项目信息 详细信息
产品分类 HbuilderX
PC开发环境 Windows
操作系统版本 WIN10
HBuilderX版本 3.4.11

bug描述：

  • 有看到说是修复了这个BUG，不太完整，仍然特别难用，3.4.11.20220520-alpha版
  • 键入样式，一定会加一个不成文的空格，这种东西，多按一次空格的需求和多点一次删除的需求都是同等的，没必要自动加一个空格，严格的标准，一个width:它是纯粹的width:还是非得有个空格它才成立？
  • &: 之后，伪类没有代码提示
  • 样式行数超过3行的时候仍然出现语言替换位置错误
  • 希望能得到完整修复。另外，希望按照纯粹一点的格式，代码写的可读性怎么样，好不好看，取决于写代码的人。


更多关于uni-app 3.4.11.20220520-alpha版CSS语言替换位置错误的Bug的实战教程也可以访问 https://www.itying.com/category-93-b0.html

2 回复

感谢反馈，后期修复

更多关于uni-app 3.4.11.20220520-alpha版CSS语言替换位置错误的Bug的实战教程也可以访问 https://www.itying.com/category-93-b0.html


在 uni-app 的 3.4.11.20220520-alpha 版本中，确实存在一个关于 CSS 语言替换位置错误的 Bug。这个 Bug 可能会导致在某些情况下，CSS 代码的位置被错误地替换或调整，从而影响页面的样式渲染。

问题描述

在开发过程中，开发者可能会遇到以下情况：

  1. 在 vue 文件中编写的 CSS 代码在编译后位置发生了变化。
  2. 样式优先级被错误地调整，导致页面样式不符合预期。
  3. 在某些组件或页面中，样式被错误地覆盖或丢失。

解决方法

针对这个问题，可以尝试以下解决方法：

  1. 升级版本：

    • 检查是否有更新的 uni-app 版本发布，官方可能已经修复了这个 Bug。可以尝试升级到最新的稳定版或 beta 版。

  2. 手动调整 CSS 代码：

    • 如果暂时无法升级版本，可以手动调整 CSS 代码的顺序，确保样式优先级正确。例如，将重要的样式放在更靠前的位置，或者使用 !important 来提高优先级。

  3. 使用 Scoped CSS：

    • 在 vue 文件中使用 scoped 样式，确保样式只作用于当前组件，避免样式污染。
    <style scoped>
.example {
    color: red;
}
</style>

  4. 检查编译配置：

    • 检查 vue.config.js 或 vite.config.js 中的 CSS 相关配置，确保没有错误的配置导致 CSS 代码位置被错误地调整。

  5. 反馈给官方：

    • 如果问题依然存在，可以将问题反馈给 uni-app 官方团队，提供详细的复现步骤和代码示例，帮助官方更快地定位和修复问题。

示例代码

以下是一个简单的示例，展示了如何在 vue 文件中使用 scoped 样式：

<template>
  <div class="example">
    Hello, uni-app!
  </div>
</template>

<script>
export default {
  name: 'ExampleComponent'
}
</script>

<style scoped>
.example {
  color: red;
  font-size: 16px;
}
</style>
回到顶部