uniapp中用:class语法时，带有方括号[]的class的引号会被编译成\"，导致windows版本小程序开发工具无法上传代码

[Dongsw08]

描述这个问题： 当有 这样有:class语法的代码时，带有方括号[的class会被编译成 导致在windows的微信开发者工具上无法上传代码 mac不受影响

如何复现：

期待的结果： 应当直接编译为单引号'而不是 \"

问题相关截图：

本插件版本：

1.5.6

开发框架版本（三选一填写）：

• Uni-app:

其余信息：

[coolge521]

我也遇到这个问题了 尴尬！！！ mac上点预览也是报错

[sanxcsoft]

babel在转换AST的时候，会把字符串节点单号号变双引号，包含双引号的样式放入class=""会被转义

解决方案：

1. 改源码，重新发布npm包

template-handler.ts 找到generatorOpts配置处，加上jsescOption: {quotes: 'single' // 强制生成单引号} 最终： generatorOpts: { compact: true, retainLines: true, jsescOption: { quotes: 'single' // 强制生成单引号 } }

2. 找到node_modules，找到对应的包，直接修改rollup.js，

同样找到generatorOpts配置处，加上jsescOption: {quotes: 'single' // 强制生成单引号}

[coolge521]

谢谢你的回复，辛苦了！

------------------ Original ------------------ From: @.>; Date: 2025年3月4日(星期二) 晚上10:38 To: @.>; Cc: @.>; @.>; Subject: Re: [dcasia/mini-program-tailwind] uniapp中用:class语法时，带有方括号[]的class的引号会被编译成"，导致windows版本小程序开发工具无法上传代码 (Issue #112)

babel在转换AST的时候，会把字符串节点单号号变双引号，包含双引号的样式放入class=""会被转义

解决方案：

改源码，重新发布npm包

template-handler.ts 找到generatorOpts配置处，加上jsescOption: {quotes: 'single' // 强制生成单引号} 最终： generatorOpts: { compact: true, retainLines: true, jsescOption: { quotes: 'single' // 强制生成单引号 } }

找到node_modules，找到对应的包，直接修改rollup.js，

同样找到generatorOpts配置处，加上jsescOption: {quotes: 'single' // 强制生成单引号}

— Reply to this email directly, view it on GitHub, or unsubscribe. You are receiving this because you commented.Message ID: @.***> sanxcsoft left a comment (dcasia/mini-program-tailwind#112)

babel在转换AST的时候，会把字符串节点单号号变双引号，包含双引号的样式放入class=""会被转义

解决方案：

改源码，重新发布npm包

template-handler.ts 找到generatorOpts配置处，加上jsescOption: {quotes: 'single' // 强制生成单引号} 最终： generatorOpts: { compact: true, retainLines: true, jsescOption: { quotes: 'single' // 强制生成单引号 } }

找到node_modules，找到对应的包，直接修改rollup.js，

同样找到generatorOpts配置处，加上jsescOption: {quotes: 'single' // 强制生成单引号}

— Reply to this email directly, view it on GitHub, or unsubscribe. You are receiving this because you commented.Message ID: @.***>

[Dongsw08]

写了个vite plugin，replace-double-quotes-plugin.ts

//replace-double-quotes-plugin.ts
import * as wxml from '@vivaxy/wxml'

export default () => {
    return {
        name: 'replace-class-double-quotes',
        enforce: 'post',
        generateBundle(_outputOptions, bundle) {
            for (const filename in bundle) {
                if (/\.wxml$/.test(filename)) {
                    const asset = bundle[filename]

                    const source = asset.source
                    const parsed = wxml.parse(source)

                    wxml.traverse(parsed, function visitor(node, parent) {
                        if (node.type === wxml.NODE_TYPES.ELEMENT) {
                            if (node.attributes.class) {
                                if(node.attributes.class.includes('\"')) {
                                    node.attributes.class = node.attributes.class.replace(/"/g, "'")
                                }
                            }
                        }
                    })

                    asset.source = wxml.serialize(parsed)
                }
            }
        }
    }
}

//vite.config.ts
import replaceDoubleQuotes from './replace-double-quotes-plugin';

export default defineConfig({
plugins:[
...,
replaceDoubleQuotes(),
]
})

先这么解决吧，目前没发现什么问题

[SAmmmg]

写了个vite plugin，replace-double-quotes-plugin.ts

//replace-double-quotes-plugin.ts
import * as wxml from '@vivaxy/wxml'

export default () => {
    return {
        name: 'replace-class-double-quotes',
        enforce: 'post',
        generateBundle(_outputOptions, bundle) {
            for (const filename in bundle) {
                if (/\.wxml$/.test(filename)) {
                    const asset = bundle[filename]

                    const source = asset.source
                    const parsed = wxml.parse(source)

                    wxml.traverse(parsed, function visitor(node, parent) {
                        if (node.type === wxml.NODE_TYPES.ELEMENT) {
                            if (node.attributes.class) {
                                if(node.attributes.class.includes('\"')) {
                                    node.attributes.class = node.attributes.class.replace(/"/g, "'")
                                }
                            }
                        }
                    })

                    asset.source = wxml.serialize(parsed)
                }
            }
        }
    }
}

//vite.config.ts
import replaceDoubleQuotes from './replace-double-quotes-plugin';

export default defineConfig({
plugins:[
...,
replaceDoubleQuotes(),
]
})

先这么解决吧，目前没发现什么问题

感谢大佬，解决问题了