uni-app 真机运行.scss文件 注释报错

uni-app 真机运行.scss文件 注释报错

开发环境 版本号 项目创建方式
Windows win11 HBuilderX

产品分类：uniapp/App

PC开发环境操作系统：Windows

PC开发环境操作系统版本号：win11

HBuilderX类型：Alpha

HBuilderX版本号：4.54

手机系统：Android, iOS 18

手机厂商：苹果

手机机型：11

页面类型：vue

vue版本：vue3

打包方式：离线

操作步骤：

随便一个项目，正常引入一个带有//注释的 .scss文件，进行真机运行就报错了

预期结果：

要么正常运行，要么快捷健生成的注释自动更换为 /*

实际结果：

快捷健生成的多行注释为 // ，h5端运行正常，真机报错

bug描述：

.scss文件中使用 //注释真机允许报错  
[plugin:commonjs] [postcss] postcss-import: D:\Project\ly-palm-app\pages\league\service-list\components\global.scss:65:6: Unknown word  
这个其实应该算是hbuildx的问题，因为是使用的快捷健ctrl+/ 进行多行注释的

更多关于uni-app 真机运行.scss文件 注释报错的实战教程也可以访问 https://www.itying.com/category-93-b0.html

2 回复

看下你的 scss 语法内容吧，截图或者给我源代码。我使用 vue3+ HBuilderX alpha 最新版，测试下面这个 global.scss 到安卓模拟器正常。
// test
// .abc{color:red}
.abc{
// 测试；
color: green;
}

更多关于uni-app 真机运行.scss文件 注释报错的实战教程也可以访问 https://www.itying.com/category-93-b0.html


这是一个常见的SCSS编译问题。在SCSS文件中，使用//注释在H5环境下可以正常运行，但在真机环境下会报错，这是因为：

  1. 真机环境使用的是PostCSS处理SCSS文件，而PostCSS默认不支持//单行注释语法
  2. HBuilderX生成的快捷注释(Ctrl+/)默认使用//形式

解决方案有以下几种：

  1. 手动将//注释改为/* */形式
  2. 在项目根目录的postcss.config.js中添加配置：
module.exports = {
  parser: 'postcss-scss',
  // 其他配置...
}
回到顶部