javascript 如何将vscode css颜色选择器功能引入到js文件中，并使用与颜色名称格式匹配的字符串？

t5fffqht 于 2023-01-01 发布在 Java

关注(0)|答案(7)|浏览(158)

https://code.visualstudio.com/docs/languages/css
目前没有一个插件可以做到这一点。我真的很惊讶。甚至intellij也有这样的支持！
而且vscode本身的回复也有点没什么帮助。https://github.com/Microsoft/vscode/issues/36485
任何关于如何构建这样的插件的提示，似乎不应该真的很难，因为它真的只是从一个文件扩展名移植到另一个功能？
有人能解决吗？

JavaScript

来源：https://stackoverflow.com/questions/50532485/how-to-bring-the-vscode-css-color-picker-feature-into-js-file-with-string-that-m

7条答案

按热度按时间

epggiuax1#

我发现colorize可以突出显示 JavaScript 和 TypeScript（以及其他）GitHub
在 VSCode 的settings.json中，只需添加您想要的目标语言：

"colorize.languages": ["typescript", "javascript", "css", "scss"]

赞(0）回复(0）举报 2023-01-01

qnzebej02#

对于任何使用Colorize并希望它在他们的React项目（JS中的CSS等）上工作的人，请用途：

"colorize.languages": ["javascriptreact", "javascript", "css", "scss"]

因为显然需要“javascripreact”而不是“javascript”
对于React中的类型脚本，请使用“typescripreact”。

赞(0）回复(0）举报 2023-01-01

3pmvbmvn3#

正在更新此问题。似乎是：
https://marketplace.visualstudio.com/items?itemName=AntiAntiSepticeye.vscode-color-picker
添加了颜色选择器，将功能引入其他语言。
个人测试和工程的 typescript 。这是相对较新的，所以它没有很多下载或安装，但它的作品作为广告。

赞(0）回复(0）举报 2023-01-01

piah890a4#

VS扩展JSON color token能够以任何语言调出本机颜色选择器。
要使其在JS和React中工作，请将其添加到VS Code的settings.json中：

"jsonColorToken.languages": [
    "json",
    "jsonc",
    "javascript",
    "javascriptreact"
  ]

图片来源：https://github.com/YECHUNAN/json-color-token/issues/2#issuecomment-977261832

赞(0）回复(0）举报 2023-01-01

vktxenjb5#

wayncheng的vscode-color-info有一个可能的实现
将以下代码添加到settings.json中的colorInfo.languages中就可以了。确保包括所有默认语言，这样它们就不会被禁用。

{
    "selector": "javascript",
    "colors": "css"
}

所以你的settings.json应该看起来像这样：

"colorInfo.languages": [
    {
        "selector": "css",
        "colors": "css"
    },
    {
        "selector": "sass",
        "colors": "css"
    },
    {
        "selector": "scss",
        "colors": "css"
    },
    {
        "selector": "less",
        "colors": "css"
    },
    {
        "selector": "html",
        "colors": "css"
    },
    {
        "selector": "javascript",
        "colors": "css"
    }
]

赞(0）回复(0）举报 2023-01-01

izkcnapc6#

在我的create-react-app项目中使用"colorize.include": ["**/*.js"]是可行的

赞(0）回复(0）举报 2023-01-01

hzbexzde7#

我遇到了TSX（带XML的TypeScript文件）不能正确突出显示颜色的问题，解决方法是在数组中添加“typescripreact”，如@rouan的帖子所述。
PS @Ali Mert Cakar它没有添加颜色选择器，只突出显示相应颜色中的颜色。

赞(0）回复(0）举报 2023-01-01