didi / didi/mpx

[Bug report] unocss使用@apply产生异常

Open
#2,145 6 comments 0 reactions 1 assignee Claimed by @cwyyue View on GitHub
enhancement
Dominant language
JavaScript
Stars
3.9k
Forks
392
Avg merge
3d 12h
Merged PRs (30d)
15

Description

**问题描述**
请用简洁的语言描述你遇到的bug,至少包括以下部分,如提供截图请尽量完整:
1. 问题触发的条件
在style标签里面使用@apply,编译后的wxss文件只会生成@apply最后一个样式。
2. 期望的表现
比如@apply text-red-1 bg-white;
3. 实际的表现
只会生成background-color: white;

**环境信息描述**
至少包含以下部分:
1. 系统类型(Mac或者Windows)
windows和mac都一样
2. Mpx依赖版本(@mpxjs/core、@mpxjs/webpack-plugin和@mpxjs/api-proxy的具体版本,可以通过package-lock.json或者实际去node_modules当中查看)
最新版本
3. 小程序开发者工具信息(小程序平台、开发者工具版本、基础库版本)
微信、抖音

**最简复现demo**

.list {
// --at-apply: bg-red-500;
@apply text-gray-1 bg-red-500;

// 这里只会生成最后一个css,比如leading-40px
.item {
@apply text-red-1 bg-white leading-40px;
// 如果使用--at-apply,末行会多生成一个分号,导致微信开发工具报错
// --at-apply: text-red-1 bg-white leading-40px;
/**
[ WXSS 文件编译错误]
./components/list4cb8a88a/index.wxss(10:161): unexpected token `;`(env: Windows,mp,1.06.2505152; lib: 3.8.4)
*/
}

/**
./components/list4cb8a88a/index.wxss(3:3): unexpected `@` at pos 44(env: Windows,mp,1.06.2505152; lib: 3.8.4)
*/
}

仓库地址:https://github.com/liziwork/mpx-windows-easy-demo
请查看components/list组件style部分

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.