Welcome Dialog

Welcome to the Community!

We have a brand new look! Take a tour with us and explore the latest updates on Adobe Support Community.


Confusions about customised Target Language Support in the VSCode Extension for Adobe XD

Explorer ,
Jun 08, 2021 Jun 08, 2021

Copy link to clipboard

Copied

Hi there,

 

Currently, I am reviewing the VS Code Extension [1], and, I am confused which target languages are supported, and, how to build a reliable solution for our own target languages (e.g. Qt support [2], TouchGFX support [3], Unity3D support [4] ... etc.)? Does this Adobe XD Extension support us to build a DSPs for our own target languages, or, do we need to build our own solutions built on Amazons Style Dictionary [5] to achieve this? Currently, only certain target languages [6] and code snippet languages [7] are supported. Or ... can this be achieved already with the currently existing code snippet languages section without the need to choose a certain target language to create a DSP? Could you please give advice in how to proceed?

 

Thx, Sebastian

 

[1] https://www.adobe.com/products/xd/learn/design-systems/cloud-libraries/vscode-extension.html

[2] https://doc.qt.io/

[3] https://support.touchgfx.com/docs/introduction/welcome

[4] https://docs.unity3d.com/ScriptReference/

[5] https://amzn.github.io/style-dictionary/

[6] Currently supported target languages:

  • CSS
  • Flutter (Dart)
  • Android (Java)
  • Javascript
  • iOS (Objective-C)
  • SCSS
  • iOS (Swift)

[7] Currently supported code snippet languages:

 

"languages": [
      {
        "label": "Coffeescript",
        "export_tokens": false,
        "snippet_id": "coffeescript",
        "syntax": "text/x-coffeescript"
      },
      {
        "label": "C",
        "export_tokens": false,
        "snippet_id": "c",
        "syntax": "text/x-csrc"
      },
      {
        "label": "C#",
        "export_tokens": false,
        "snippet_id": "csharp",
        "syntax": "text/x-csharp"
      },
      {
        "label": "CSS",
        "export_tokens": true,
        "snippet_id": "css",
        "syntax": "text/css",
        "ext-com_adobe_xd-styledictionary_id": "css"
      },
      {
        "label": "Flutter (Dart)",
        "export_tokens": false,
        "snippet_id": "dart",
        "syntax": "application/vnd.dart",
        "ext-com_adobe_xd-styledictionary_id": "flutter"
      },
      {
        "label": "F#",
        "export_tokens": false,
        "snippet_id": "fsharp",
        "syntax": "text/x-csharp"
      },
      {
        "label": "Go",
        "export_tokens": false,
        "snippet_id": "go",
        "syntax": "text/x-go"
      },
      {
        "label": "Groovy",
        "export_tokens": false,
        "snippet_id": "groovy",
        "syntax": "text/x-groovy"
      },
      {
        "label": "Handlebars",
        "export_tokens": false,
        "snippet_id": "handlebars",
        "syntax": "text/x-handlebars-template"
      },
      {
        "label": "HTML",
        "export_tokens": false,
        "snippet_id": "html",
        "syntax": "text/html"
      },
      {
        "label": "Android (Java)",
        "export_tokens": false,
        "snippet_id": "java",
        "syntax": "text/x-java",
        "ext-com_adobe_xd-styledictionary_id": "android"
      },
      {
        "label": "JavaScript",
        "export_tokens": false,
        "snippet_id": "javascript",
        "syntax": "text/javascript",
        "ext-com_adobe_xd-styledictionary_id": "js"
      },
      {
        "label": "JavaScript React",
        "export_tokens": false,
        "snippet_id": "javascriptreact",
        "syntax": "text/jsx"
      },
      {
        "label": "Less",
        "export_tokens": false,
        "snippet_id": "less",
        "syntax": "text/x-less"
      },
      {
        "label": "Lua",
        "export_tokens": false,
        "snippet_id": "lua",
        "syntax": "text/x-lua"
      },
      {
        "label": "iOS (Objective-C)",
        "export_tokens": false,
        "snippet_id": "objective-c",
        "syntax": "text/x-objectivec",
        "ext-com_adobe_xd-styledictionary_id": "ios"
      },
      {
        "label": "Objective-C++",
        "export_tokens": false,
        "snippet_id": "objective-cpp",
        "syntax": "text/x-c++src"
      },
      {
        "label": "Pug",
        "export_tokens": false,
        "snippet_id": "jade",
        "syntax": "text/html"
      },
      {
        "label": "Python",
        "export_tokens": false,
        "snippet_id": "python",
        "syntax": "text/x-python"
      },
      {
        "label": "Razor (cshtml)",
        "export_tokens": false,
        "snippet_id": "razor",
        "syntax": "text/x-csharp"
      },
      {
        "label": "Ruby",
        "export_tokens": false,
        "snippet_id": "ruby",
        "syntax": "text/x-ruby"
      },
      {
        "label": "Rust",
        "export_tokens": false,
        "snippet_id": "rust",
        "syntax": "text/x-rustsrc"
      },
      {
        "label": "SCSS",
        "export_tokens": false,
        "snippet_id": "scss",
        "syntax": "text/x-sass",
        "ext-com_adobe_xd-styledictionary_id": "scss"
      },
      {
        "label": "SASS",
        "export_tokens": false,
        "snippet_id": "sass",
        "syntax": "text/x-sass"
      },
      {
        "label": "ShaderLab",
        "export_tokens": false,
        "snippet_id": "shaderlab",
        "syntax": "text/x-vertex"
      },
      {
        "label": "iOS (Swift)",
        "export_tokens": false,
        "snippet_id": "swift",
        "syntax": "text/x-swift",
        "ext-com_adobe_xd-styledictionary_id": "ios-swift"
      },
      {
        "label": "TypeScript",
        "export_tokens": false,
        "snippet_id": "typescript",
        "syntax": "text/typescript"
      },
      {
        "label": "TypeScript React",
        "export_tokens": false,
        "snippet_id": "typescriptreact",
        "syntax": "text/typescript-jsx"
      },
      {
        "label": "Markdown",
        "export_tokens": false,
        "snippet_id": "markdown",
        "syntax": "text/x-markdown"
      }
    ]

 

 

Learn how designers and developers can collaborate to build better design systems using Adobe XD and Visual Studio Code, powered by Creative Cloud Libraries....

Views

251

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Jun 08, 2021 Jun 08, 2021

Copy link to clipboard

Copied

For some reason, this conversation named "Confusions about customised Target Language Support in the VSCode Extension for Adobe XD" does not show up in the Adobe XD conversation list ...
https://community.adobe.com/t5/adobe-xd/bd-p/xd?page=1&sort=latest_replies&filter=no_replies

Any advice on this conversation?

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Jun 16, 2021 Jun 16, 2021

Copy link to clipboard

Copied

Hi there, does anyone in here use the Adobe XD Extension for VSCode [1]. Help appreciated. Thx.

[1] https://www.adobe.com/products/xd/learn/design-systems/cloud-libraries/vscode-extension.html

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Jul 30, 2021 Jul 30, 2021

Copy link to clipboard

Copied

LATEST

Hi again, has anyone any updates on this matter? Is the Adobe XD VSCode Extension still under active development? Are you still working on a Design2Code-Toolchain [1]? If not, maybe Supernova.io [2] would be of help in near future, which also works on a VSCode Extension [3].

 

[1] https://adobexd.uservoice.com/forums/353007-adobe-xd-feature-requests/suggestions/12931119-built-in-...

[2] https://www.supernova.io

[3] https://developers.supernova.io/using-exporters/running-exporters

 

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines