在 VSCode 中为 JSX 配置 Emmet [英] Configure Emmet for JSX in VSCode

问题描述

我这样使用 CSS:

const 样式 = {富:{红色'}}<div className={styles.foo}/>

并且我希望 emmet 将 .foo 扩展为 <div className={styles.foo}></div>

我在

在项目框中输入 javascript 并在值字段中输入 javascriptreact 后，最后按 添加项目.您的最终输出必须如下图所示:

I use CSS like this:

const styles = {
  foo: {
    color: 'red'
  }
}

<div className={styles.foo} />

and I want emmet to expand .foo to <div className={styles.foo}></div>

I don't see any reference to class or className in emmet's config file.

Also looked into preferences.json and didn't find a solution.

It seems very simple to do.

What am I missing here?

My code editor is vscode.

解决方案

Press Ctrl + , or Cmd + , or File > Preferences > Settings. This will open Settings window. Go to Workspace tab > Extensions > Emmet.

For the current vs code new version, you'll see a menu called Included Languages. similar to this:

After enter javascript in the item box and after type javascriptreact in the value field and finally press Add item. Your final output must look like the image below:

这篇关于在 VSCode 中为 JSX 配置 Emmet的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！