0e6771d8.d41c1c5e.js

(window.webpackJsonp=window.webpackJsonp||[]).push([[6],{119:function(e,t,n){"use strict";n.d(t,"a",(function(){return u})),n.d(t,"b",(function(){return f}));var o=n(0),r=n.n(o);function s(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function i(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);t&&(o=o.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,o)}return n}function a(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?i(Object(n),!0).forEach((function(t){s(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):i(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}function c(e,t){if(null==e)return{};var n,o,r=function(e,t){if(null==e)return{};var n,o,r={},s=Object.keys(e);for(o=0;o<s.length;o++)n=s[o],t.indexOf(n)>=0||(r[n]=e[n]);return r}(e,t);if(Object.getOwnPropertySymbols){var s=Object.getOwnPropertySymbols(e);for(o=0;o<s.length;o++)n=s[o],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(r[n]=e[n])}return r}var l=r.a.createContext({}),p=function(e){var t=r.a.useContext(l),n=t;return e&&(n="function"==typeof e?e(t):a(a({},t),e)),n},u=function(e){var t=p(e.components);return r.a.createElement(l.Provider,{value:t},e.children)},d={inlineCode:"code",wrapper:function(e){var t=e.children;return r.a.createElement(r.a.Fragment,{},t)}},b=r.a.forwardRef((function(e,t){var n=e.components,o=e.mdxType,s=e.originalType,i=e.parentName,l=c(e,["components","mdxType","originalType","parentName"]),u=p(n),b=o,f=u["".concat(i,".").concat(b)]||u[b]||d[b]||s;return n?r.a.createElement(f,a(a({ref:t},l),{},{components:n})):r.a.createElement(f,a({ref:t},l))}));function f(e,t){var n=arguments,o=t&&t.mdxType;if("string"==typeof e||o){var s=n.length,i=new Array(s);i[0]=b;var a={};for(var c in t)hasOwnProperty.call(t,c)&&(a[c]=t[c]);a.originalType=e,a.mdxType="string"==typeof e?e:o,i[1]=a;for(var l=2;l<s;l++)i[l]=n[l];return r.a.createElement.apply(null,i)}return r.a.createElement.apply(null,n)}b.displayName="MDXCreateElement"},73:function(e,t,n){"use strict";n.r(t),n.d(t,"frontMatter",(function(){return i})),n.d(t,"metadata",(function(){return a})),n.d(t,"toc",(function(){return c})),n.d(t,"default",(function(){return p}));var o=n(3),r=n(7),s=(n(0),n(119)),i={id:"vscode",title:"VSCode Support"},a={unversionedId:"intro/vscode",id:"intro/vscode",isDocsHomePage:!1,title:"VSCode Support",description:"A VSCode language extension is planned. (If you know how to develop VSCode extensions, we could use your help!) In the meantime, to get basic code coloring, you can do the following:",source:"@site/docs/intro/vscode.md",slug:"/intro/vscode",permalink:"/docs/intro/vscode",editUrl:"https://github.com/jesscss/jess/tree/master/packages/docs/docs/intro/vscode.md",version:"current",sidebar:"someSidebar",previous:{title:"Configuration",permalink:"/docs/intro/config"},next:{title:"Theming",permalink:"/docs/intro/theming"}},c=[{value:"Install PostCSS Language Support",id:"install-postcss-language-support",children:[]},{value:"Associate <code>.jess</code> files with PostCSS",id:"associate-jess-files-with-postcss",children:[]},{value:"Other IDEs",id:"other-ides",children:[]}],l={toc:c};function p(e){var t=e.components,n=Object(r.a)(e,["components"]);return Object(s.b)("wrapper",Object(o.a)({},l,n,{components:t,mdxType:"MDXLayout"}),Object(s.b)("p",null,"A VSCode language extension ",Object(s.b)("a",Object(o.a)({parentName:"p"},{href:"https://github.com/jesscss/jess/issues/25"}),"is planned"),". (If you know how to develop VSCode extensions, we could use your help!) In the meantime, to get basic code coloring, you can do the following:"),Object(s.b)("h3",{id:"install-postcss-language-support"},"Install PostCSS Language Support"),Object(s.b)("p",null,"Jess doesn't use PostCSS, but this is a syntax highlighter that is flexible to syntax."),Object(s.b)("p",null,"The extension can be found here: ",Object(s.b)("a",Object(o.a)({parentName:"p"},{href:"https://marketplace.visualstudio.com/items?itemName=csstools.postcss"}),"https://marketplace.visualstudio.com/items?itemName=csstools.postcss")),Object(s.b)("h3",{id:"associate-jess-files-with-postcss"},"Associate ",Object(s.b)("inlineCode",{parentName:"h3"},".jess")," files with PostCSS"),Object(s.b)("p",null,"Add this to your ",Object(s.b)("inlineCode",{parentName:"p"},"settings.json")," file:"),Object(s.b)("pre",null,Object(s.b)("code",Object(o.a)({parentName:"pre"},{className:"language-json"}),'    "files.associations": {\n        "*.jess": "postcss"\n    }\n')),Object(s.b)("h3",{id:"other-ides"},"Other IDEs"),Object(s.b)("p",null,"For other IDEs, the process should be similar. Find a flexible CSS-y syntax highlighter (like PostCSS), and associate it with ",Object(s.b)("inlineCode",{parentName:"p"},".jess")," files."))}p.isMDXComponent=!0}}]);